質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

Q&A

1回答

4296閲覧

Webで動画をトリミングする方法は?

keita0236

総合スコア25

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

0グッド

0クリップ

投稿2015/12/03 16:57

こんばんは。
首記の件ですが、Webの製作に関連して質問がありまして
動画のトリミングを行なうには、どの言語を使えばよろしいでしょうか?

具体的には、例えばユーザーに動画をアップロードさせるためのHTMLのinput要素があったとして、ユーザーがそこをクリックして自分のライブラリーから取得した動画の秒数が10秒より長い場合はその動画の任意の範囲間を10秒間で切り取り、HTML側に出力させるというフローのイメージです。
動画の表示については、HTML5のvideoタグを使用すればできますが、上記のような動画のトリミングというのはどの言語を使えばよいか調べてもヒットしなかったもので。。。(jsあたりかなと思いましたが、ヒットしませんでした)

お手数ですが、該当する言語名および可能であればそのメソッド名についても教えていただければ幸いです。

よろしくお願いします。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

edo_m18

2015/12/04 00:10

処理についてのみではなくて、最終的なゴール(やりたいこと)を記述してもらえると回答もしやすくなります。 ちなみにトリミングしたい意図はなんでしょうか? またトリミングされた動画はサーバなどに保存するのか、あるいは表示だけできればいいのかでまた変わってくると思います。 そのあたりについても追記してもらえるといいかと思います。
keita0236

2015/12/04 03:15

コメントありがとうございます! 最終的なゴールとしては、動画を扱ったCGMを作りたいと思っていまして、今回の質問はユーザーが持つ動画をアップロードする機能の部分に関するものになります。 例えば、WebではないですがInstagramのアプリのアップロード機能においては、ライブラリーから動画を選択すると、ハサミのアイコンが用意されており、そこをタップして見せたい部分をトリミングできる機能がありますが、今回実装したいのもあのようなイメージに近いです。 具体的なフローを書くと、以下のイメージです アップロード画面でユーザーがアップロードするためのボタンを押す ↓ ライブラリーが開き、アップロードしたい動画を選択させる ↓ 動画を選択されたら、トリミングするための画面を開き、そこでトリミングを行なう ↓ アップロードボタンを押すと動画がサーバに保存およびサービス上に投稿される また、トリミングしたい意図としては色々あるのですが例えば以下のような形です ・アップロードされた各動画はサーバに保存するのでアップロードできる秒数を限定して容量を少なくし、負荷を軽減するため ・動画が長すぎると通信量の負担がかかるため、ひとつあたりの動画の秒数を限定して読み込む際の通信量を減らす ・ひとつの動画が長すぎると見終わる前にユーザーが飽きてしまう(例えば30分など) ・ユーザが見せたい部分に応じて自由に編集できるようにする
guest

回答1

0

こんにちは。直接の回答になっていないかもしれませんが、ヒントを書かせていただきます。

私なら、動画を静止画のバラバラに分解して(全部のフレームでなくてもよいですが)、それをユーザーに選択させて、その位置から再度動画をエンコーディングして返すなりストレージに保存するなりします。

静止画への分解や動画への再エンコードは、エンジンプログラム(windowsOSであれば、aviutil、ffmpeg、WindowsMediaEncoder、DirectShow など)をキックします。サーバ側でASP.NETでコーディングします。

単純にファイルデータをmバイト目からnバイト目までにぶった切ったりしても、M秒目からN秒間の動画になりませんし、コーデックの種類や動画の仕様(キーフレームの挿入頻度、ビットレートそのほか)は多種多様なので、餅は餅屋で任せます。でなければ、相当高度なコードを書くことになるでしょう。
もしマッチしたライブラリがあればラッキーです。

Windows であれば、Media Control Interface も用意されています。コーデックの用意はどこまで可能かわかりませんが...

https://msdn.microsoft.com/en-us/library/windows/desktop/dd756808.aspx

http://codezine.jp/article/detail/210

https://msdn.microsoft.com/ja-jp/library/cc353899.aspx

Java向けに"Java Media Framework API"なるものも存在するようです。試したことはありませんが、これであればUnix系のサーバでも使えそうです。

https://ja.wikipedia.org/wiki/Java_Media_Framework

http://d.hatena.ne.jp/Guernsey/20090713/1247493375

投稿2015/12/04 07:34

編集2015/12/04 07:47
hsk

総合スコア728

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問