>   TASYUの趣味で行っている電子工作や実験・プログラムの記録

電気技術とプログラムの世界

« 2007年1月 | メイン | 2007年3月 »

2007年2月 アーカイブ

2007年2月20日

YouTubeの動画を独自プレーヤーで再生

はてなやニコニコなどのようにYoutubeの動画(FLVファイル)を独自のプレーヤーに読み込む方法。

まず,FLASH VIDEO PLAYERをダウンロードする。

解凍してflvplayer.swfを自分のサーバーにアップロード。
ソースが一緒に付いてきているので知識があればカスタマイズができる。

表示場所に以下のように記述する。

<embed src="flvplayer.swfのアドレス" width="横幅" height="高さ" bgcolor="#FFFFFF" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"
flashvars="file=FLVファイルのアドレス" />

FLVファイルのアドレスはそのまま記述するのでなくて記号などを置き換えてあげなければいけない。

Youtubeの動画場合

http://www.youtube.com/watch/v=***
といったURLから
http://sjc-**.sjc.youtube.com/get_video?video_id=***
といったURLを検索して
http%3A%2F%2Fsjc-**.sjc.youtube.com%2Fget_video%3Fvideo_id%3D***.flv
に書き直す。

http%3A%2F%2Fwww.youtube.com%2Fget_video%3Fvideo_id%3D***%26t%3D***%26dummy%3D.flv
といったふうに書かなければいけない。

結構めんどくさいのでTASYULABSの方に検索スクリプトを用意しました。
(動作の保障はしません;)

検索をするとflvplayer.swf用というアドレスが表示されるのでFLVファイルのアドレスの部分にコピーしてください。

=================

FLASH VIDEO PLAYERのオプションを利用するには付属のufo.jsも一緒にアップロードする必要があります。

ufo.jsを利用する場合

<script type="text/javascript" src="ufo.jsのアドレス"></script>
<p id="player"><a href="http://www.macromedia.com/go/getflashplayer">FLASHプレーヤー</a> がインストールされていないかJavaScriptが制限されています。</p>
<script type="text/javascript">
  var FO = { movie:"flvplayer.swfのアドレス",width:"横幅",height:"高さ",majorversion:"7",build:"0",bgcolor:"#FFFFFF",allowfullscreen:"true",
flashvars:"file=FLVファイルのアドレス&オプション&オプション" };
  UFO.create(FO,"player");
</script>

の様に書いてオプションの部分に

image=画像URL 再生待ち時のプレビュー画像
autostart=true 自動再生

などを追記します。 

=================
以下はメモ

http://www.youtube.com/get_video?video_id=だと
t=要素が動的に変わるから時間がたつと再生できなくなる。
再生時に取得させるスクリプトを利用してこっちを利用したほうがいい?

http://sjc-**.sjc.youtube.com/get_video?video_id=***.flv
にすると再生できている

プレビュー画像URLの取得
http://sjc-static*.sjc.youtube.com/vi/***/0.jpg 1.jpg 2.jpg 3.jpg ...

About 2007年2月

2007年2月にブログ「電気技術とプログラムの世界」に投稿されたすべてのエントリーです。過去のものから新しいものへ順番に並んでいます。

前のアーカイブは2007年1月です。

次のアーカイブは2007年3月です。

他にも多くのエントリーがあります。メインページアーカイブページも見てください。

ページのトップへ
tasyu.com  - ブログ  - IFC  - 電気
Copyright © TASYU All rights reserved.