Home > HTML5 > 【第3回】youtubeのURLをブクマで取得→videoに設定【HTML5で作る動画コミュニティサイト】

【第3回】youtubeのURLをブクマで取得→videoに設定【HTML5で作る動画コミュニティサイト】

前回のエントリーをあとで見直すと動画がみれない事に気がついた。

youtubeをみてソースを表示して動画URLを直張りしていたけど、一定時間が経つと見れなくなるらしい。
そこで次のように考えた。

  1. http://www.youtube.com/watch?v=00000のようなURLから動画URLを抜き出すPHP作る
  2. そのPHPと動画プレーヤーのHTMLをajaxを使って画面遷移なしにやりとり
  3. ヨカッタドウガミレタヨー

ローカルでやるとうまくいった。けどネットにあげるとできなかった。
なんかローカル環境で取得したyoutubeの動画URLと、ネット環境で取得したyoutubeの動画URLが違う。
youtubeのセキュリティだとは思うけど、ググっても具体的な仕組みが分からなかった。
サブアドレスにプロバイダーっぽい文字があったから、IPで動的にURLを生成しているのかな?(KDDIがあった)
リファラーやユーザーエージェントは偽装できるけど、IPアドレスは難しいとか聞いたことがあったようなないような・・・。

 

いろいろかんがえたけど、自分のサイトで不特定多数の人にyoutubeの動画を見れるようにするには、その人がyoutubeにアクセスするしか方法がないと結論。
外部プレーヤーやapiを使うのはなしの話で。
そういや動画寄生サイトもyoutubeは外部プレーヤーを使っていたな~とここでふと思い出す。

 

んでもって、調べているうちにブックマークレットで見ているyoutubeの動画URLを抜き出す、というのを発見したのを思い出す。

  1. youtubeを見る
  2. ブクマでURLを取得して自分のサイトに移動する
  3. getクエリの文字列から動画URLを取得してvideoタグに設定

これなら大丈夫そう。ちょっとめんどいけど。

できたのが次のjavascript

javascript:(
function(){
var ids=[
'watch-headline',
'playnav-panel-info',
'ud',
'vt',
'watch-actions',
'watch-info',
'watch-panel',
'masthead'
],
no_flv=true,
f={},
e,f,g,i,j,s,t,
ti='video',
x,map,
r='';
for(i in ids)
if(e=document.getElementById(ids[i]) )
break;
if(!e)
return;
try{
if(yt&&yt.getConfig)
map=yt.getConfig('PLAYER_CONFIG').args.url_encoded_fmt_stream_map;
}
catch(t){}
if(!map){
x=document.getElementsByTagName('body')[0].innerHTML;
if(x.match(/&(amp;|)url_encoded_fmt_stream_map=([^&">]+)/)){
map=decodeURIComponent(RegExp.$2);
}
else if(x.match(/[\'\"]PLAYER_CONFIG[\'\"]\s*:\s*({.*})/)){
map=eval('('+RegExp.$1+')').args.url_encoded_fmt_stream_map;
}
}
if(!map)
return;
map=map.split(',');

for(i in map){
x=map[i].split('&');
f={};
for(j in x){
g=x[j].split('=');
f[g[0]]=g[1];
}
if(f['type']&&f['type'].match(/video\/([a-zA-Z0-9_\-]+)/))
t=RegExp.$1;
if(no_flv&&t=='x-flv')
continue;
r += '&u=' + f['url'];
}
r = 'http://www.hk-factory.net/wp-content/uploads/2012/01/sample_03_018.html?' + r.substr(1);
window.open(r, null);
})()

この手間をメリットに変えれればいいけどな~と
まだぼや~っとしたものしか見えないけど。

先は長いな~

 

上のブックマークレットは次のURLを参考にしました
うえぽんSW局

Comments:0

Comment Form
Remember personal info

Trackbacks:0

Trackback URL for this entry
http://www.hk-factory.net/html5/123/trackback/
Listed below are links to weblogs that reference
【第3回】youtubeのURLをブクマで取得→videoに設定【HTML5で作る動画コミュニティサイト】 from hk_factory

Home > HTML5 > 【第3回】youtubeのURLをブクマで取得→videoに設定【HTML5で作る動画コミュニティサイト】

twitter
リンク

Return to page top