search
LoginSignup
9

More than 5 years have passed since last update.

posted at

updated at

Organization

動的にVideoタグを生成する

背景

Chromeでは内部的にWebP形式を扱えたりするみたいで、比較的容易にWebMの生成が動的の行える。

また、Emscriptenでffmpegや、libvpxのjs化が行われているので、Firefoxでも動的にWebMの生成が用意に行えるようになった。

単純にVideoタグを生成するだけだとダメ

videoタグにcontrols属性をsetAttributeで追加すると
コントロールが有効になり、フツーに扱える。

var video = document.createElement("video");
video.src=hogeUrl; // 動的に生成した動画のURL
video.setAttribute("controls","");

document.body.appendChild(video);

注意

どうも、動的に生成したWebMの中には、1度限りしか、この
方法で再生出来ないファイルもある模様。

生成されたファイル単独ではフツーにブラウザで開くと、
何度でも再生出来るのの、この方法で動的に生成した
videoタグでは1度再生すると以降、うまく再生出来ない
こともある

Link

関連記事

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
What you can do with signing up
9