youtube動画情報のスクレイピング方法とは?

このQ&Aのポイント
  • youtubeのAPIでは取得できない動画統計情報をスクレイピングする方法を探しています。
  • javascriptのコードを使用して、「watch-actions-ajax」要素に生成された情報を取得することが目標です。
  • 行番号1~4を実行し、次に行番号5~6を実行する必要がありますが、一度に実行するとうまくいきません。
回答を見る
  • ベストアンサー

youtube動画情報のスクレイピングをするには?

youtubeのAPIで動画の詳細情報を取得しているのですが、APIでは配信されていない情報も取得したくて、youtubeの動画の統計情報のスクレイピングを行おうと挑戦してみましたがうまく出来ません。以下のソースは取得した動画の統計情報をコンソール上に表示させるというものです。 要素「id="watch-insight-button"」をクリックすると、javascriptが実行されて、元々ある要素「id="watch-actions-area-container"」以下に要素「id="watch-actions-ajax"」が動的に生成されます。この生成された情報をコンソールに表示させたいのです。実行環境はGoogleChromeの「要素の検証」の「Console」で実行しました。 http://www.youtube.com/watch?v=xIP41E4B-bIへ行き、クロームのコンソールに以下を入力 /*1*/var elem = document.getElementById('watch-insight-button'); /*2*/var event = document.createEvent('MouseEvents'); /*3*/event.initEvent('click', true, false); /*4*/elem.dispatchEvent(event); /*5*/var el = document.getElementById('watch-actions-ajax'); /*6*/console.log(el.innerHTML); 実は行番号の1~4までを入力しエンターを押して実行し終わった後で、行番号の5,6を入力しエンターを押してというように分けて実行すればうまく表示されるのですが、わけあって本番環境は「phantom.js」で実行しているため、この動作1~6までを一気に実行させなければならなくて、そうするとうまく表示されないのです。 行番号1,2,3,4が実行された後で、以下のコードをはさみ一定時間待機してから行番号5,6を実行してみたのですが、これもうまくいきませんでした。 mysleep(5000); function mysleep( waitMilliSeconds ) { var startTime = ( new Date( ) ).getTime( ); while ( true ) { if ( ( new Date( ) ).getTime( ) >= startTime + waitMilliSeconds ) break; } }

質問者が選んだベストアンサー

  • ベストアンサー
  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.1

ご質問文を読んだだけなので、まったくの推測だけの回答になりますが、 ajaxで情報を取得しているのではないかと推測されますので、そちらの処理が実行されるように、一度スクリプトを終了してあげることが必要なのでは? 連続して時間待ちのスクリプトを実行しても、ajaxの処理が走らないのではないかと推測します。 動的に生成される要素を判断材料にしても良いのであれば setIntervalなどで対象要素が生成されたかを監視して、内容を取得するようにすれば良いのではないでしょうか。 何も調べてないし、検証もしていないのではずしていましたら失礼。 しかし、実際にサイトに行くのなら、直接ボタンをクリックした方が簡単そうな…?

20081217
質問者

お礼

ありがとうございます、fujillinさんのおかげで解決しました!ネットワークを監視してたらGETで呼び出しているURLが生成されていました。このURLを直接叩く事にします!

関連するQ&A

  • JS初心者です。このコードの式を教えてください

    下記はストップウォッチのコードとなります 「startTime = startTime + (new Date()).getTime() - stopTime;」 ここの式の意味がわかりません。 startTimeは 「if (!startTime) { startTime = (new Date()).getTime(); }」 の部分で、0秒にセットされている?と思います。 ですのでストップウォッチをスタートした1秒後にストップを作動させ、再度スタートさせるときの時間は 「startTime = startTime + (new Date()).getTime() - stopTime;」つまり 「startTime = 0秒 + (new Date()).getTime() - 1秒;」 と言い換えられると思います。単純に考えて1秒でストップさせてスタートする時刻も1秒目からですので、自ずと(new Date()).getTime()の中身は2秒になっちゃうと思っているのですが、どこからそのような数字がくるんだよということで絶対に違うと思います。 色々とわかりません。どなたかこの式を教えてください! <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>ストップウォッチ</title> </head> <body> <h1>ストップウォッチ</h1> <div id="sec" style="font-size:128px">0.00</div> <input type="button" value="Start!" id="run"> <input type="button" value="Stop!" id="stop"> <input type="button" value="Reset!" id="reset"> <script> (function(){ var startTime, stopTime, running = false, timerId; document.getElementById('run').onclick = function(){ run(); } document.getElementById('stop').onclick = function(){ stop(); } document.getElementById('reset').onclick = function(){ reset(); } function run() { if(running) return; running = true; if (stopTime) { startTime = startTime + (new Date()).getTime() - stopTime; } if (!startTime) { startTime = (new Date()).getTime(); } timer(); } function timer() { document.getElementById('sec').innerHTML = (((new Date()).getTime() - startTime) / 1000).toFixed(2); timerId = setTimeout(function() { timer(); }, 100); } function stop() { if(!running) return false; running = false; clearTimeout(timerId); stopTime = (new Date()).getTime(); } function reset() { if(running) return; startTime = undefined; document.getElementById('sec').innerHTML = '0.00'; } }()); </script> </body> </html>

  • javascriptのストップウオッチのコード

    javascript初級勉強中です。 以下のコードを実行すると(1)小数点第2の動きがおかしい。  (2)一度リセットボタンを押さないとタイマーが動かない。 という2点の不具合が出ます。   どうすれば解決するでしょうか? <!DOCTYPE HTML> <head> <meta charset="utf-8"> <title>ストップウォッチ</title> </head> <body> <h1>ストップウオッチ</h1> <div id="sec" style="font-size:128px">0.00</div> <input type="button" value="Start!" onclick="run();"> <input type="button" value="Stop!" onclick="stop();"> <input type="button" value="Reset!" onclick="reset();"> <script> var statTime, stopTime, running = false, timerId; function run() { if (running)return; running = true; if (stopTime) { startTime = startTime + (new Date()).getTime() - stopTime; } if (! startTime) { startTime = (new Date()).getTime(); } timer(); //タイマー処理回していく } function timer() { document.getElementById('sec').innerHTML = (((new Date()).getTime()- startTime)/1000). toFixed(2); timerId =setTimeout(function() { timer(); //このタイマー自身を回していく }, 100); } function stop() { if (!running) return false; running = false; clearTimeout(timerId); //timerIdを渡して止める stopTime = (new Date()).getTime(); } function reset() { if (running) return;   startTime = undefined; document.getElementById('sec').innerHTML = '0.00'; } </script> </body> </html>

  • 入力ボタンによってtextareaの幅を変更

    try { elem_id = event.srcElement.id; } catch ( e ) { elem_id = event.target.id; } if (event.keyCode == 13 || event.charCode == 13) { var m = document.getElementById(elem_id); var r = m.getAttribute("rows"); m.setAttribute("rows", parseInt(r)+1); } else if(event.keyCode == 8 || event.charCode == 8){ var m = document.getElementById(elem_id); var r = m.getAttribute("rows"); if(parseInt(r)>1){ m.setAttribute("rows", parseInt(r)-1); } } 現在、textareaのonkeydownイベントで上の関数を呼び出しているのですがこれを行の先頭でバックスペースを押されたときのみtextareaのrowsを1減らすというようにしたいのですがやり方が分かりません。 例えば、textareaの内容が aa bb といったような場合、bbの前でバックスペースが押されたときのみrowsを1減らしたいのです。 よろしくお願いします。

  • JavaScriptでイベントまでのカウントを作りたい。

    教えてください。JavaScript初心者です。 JavaScriptでイベントまでのカウントを作りたいのですが、 日にちを画像でだして、指定した日がきたら、画像で差し替えるようにしたいのですが、どうすればいいのでしょうか? ※現在は指定した日がきたら、「おめでとう」の文字がでるようにしてます。 書いたタグは下記になります。 アドバイスをお願いします。 <script language="JavaScript"><!-- var now = new Date(); var point = new Date(2009,8-1,25); var countdown = Math.ceil( ( point.getTime() - now.getTime() ) / (1000*60*60*24) ); if(countdown > 0) { document.write('countdown '); } else { document.write('おめでとう!'); } // --></script>

  • クッキー情報の保存日数

    function setCookie(keyname, val){ var tmp = keyname + "=" + escape(val) + ";"; var gmt = new Date(); gmt.setTime(gmt.getTime() + 9*60*60*1000 + 24*60*60*1000*365); tmp += "expires=" + gmt.toGMTString(); document.cookie = tmp; 上記設定にてクッキーが保存されていますが、1週間もしない内に保存された情報が消えてしまいます。1年以上保存しておきたい場合はどのように設定すればいいのでしょうか?

  • クッキー情報の保存日数

    function setCookie(keyname, val){ var tmp = keyname + "=" + escape(val) + ";"; var gmt = new Date(); gmt.setTime(gmt.getTime() + 9*60*60*1000 + 24*60*60*1000*365); tmp += "expires=" + gmt.toGMTString(); document.cookie = tmp; 上記設定にてクッキーが保存されていますが、1週間もしない内に存された情報が消えてしまいます。1年以上保存しておきたい場合はどのように設定すればいいのでしょうか?

  • それぞれの表記の色を変えるには?

    先日、日数カウンターの代わりに、表記を変えるには という質問をして、お答えを頂き、無事解決したのですが、また新たな壁にぶつかってしまいました・・・ <script type="text/javascript"> <!-- var tday=new Date(); var bday=new Date(2013,2-1,4); var days=Math.floor((tday.getTime()-bday.getTime())/(24*60*60*1000));if(days>=301){document.write("良く出来ました");} else if(days>=100){document.write("あともう少し");} else if(days>=51){document.write("この調子で");} else {document.write("頑張りましょう");} // --> </script> というプログラムで、 以下のように変更して、文字の色を変える事はできたのですが <font color="#0000ff"><script type="text/javascript"> <!-- var tday=new Date(); var bday=new Date(2013,2-1,4); var days=Math.floor((tday.getTime()-bday.getTime())/(24*60*60*1000));if(days>=301){document.write("良く出来ました");} else if(days>=100){document.write("あともう少し");} else if(days>=51){document.write("この調子で");} else {document.write("頑張りましょう");} // --> </script></font></td> 以下のように、その表記別に色を変える方法が分かりません 良く出来ました   赤 font color="#ff0000 あともう少し     青 font color="#0000ff この調子で     黄色 font color="#ffff00 どなたか、分かる方がいらっしゃいましたら、どうか宜しくお願い致します。

  • 繰り返し処理をして、要素がいくつあっても、うまくい

    while文で繰り返し処理をして、要素がいくつあっても、うまくいくようにしたいのですが、var inputResultをカプセル化できないのでこのような場合どうすればいいのでしょうか? https://codepen.io/anon/pen/XqOWrQ document.querySelectorAll('.js-myBtn').addEventListener と変更したのですが、このボタンの一つ目を押したら一つ目として実行二つ目以降も同様にとなりません。 イベントを起こすトリガーの要素を配列で指定はできないのでしょうか?

  • イベントリスナーの部分を関数にしたい

    イベントリスナーの部分で、「load」以外に「change」も必要になったので関数にしたいのですが、 引数の関数の指定方法がわかりません。 どうすればいいのでしょうか。よろしくお願いします。 【イベントリスナーを関数にする前】 function hoge(){ this.view = function(){ var _this = this; window.addEventListener( 'load',function(){ _this.foo()}, false ); } this.foo =function(){ var txt = document.createTextNode( this.moji ); document.body.appendChild( txt ); } } var a =new hoge(); a.moji="テスト"; a.view(); 【やってみたこと】 function hoge(){ this.view = function(){ var _this = this; var func = function(){ _this.foo()}; this.addListener( 'window', 'load', func ); } this.addListener = function(elem,type,func){ elem.addEventListener( type,func, false ); } this.foo =function(){ var txt = document.createTextNode( this.moji ); document.body.appendChild( txt ); } } var a =new hoge(); a.moji="テスト"; a.view();

  • scriptが実行されません

    現在勉強中でドットインストールのJavaScriptでストップウォッチを作ろうのコードを書いています。 ですが、急にscript が実行されなくなってしまいました。 何かコードに間違いがあるのでしょうか?ご指摘いただけると助かります。 以下コード <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>ストップウォッチ</title> <style> body{ background:#e0e0e0; font-family:Arial, sans-serif; text-align:center; } #timerText{ color:#00aaff; font-size:128px; margin:40px auto; text-shadow:0 1px 0 rgba(255,255,255,0.5); } </style> </head> <body>  <div id="timerText">0.00</div>  <button id ="start">START</button>  <button id ="stop">STOP</button>  <button id ="reset">RESET</button> <script> (function(){ 'use.strict'; var startTime; var timerId; var startButton =document.getElementById('start'); var stoptButton =document.getElementById('stop'); var resetButton =document.getElementById('reset'); var timerText =document.getElementById('timerText'); startButton.addEventListener('click',function(){ startTime =Date.now(); updateTimerText(); }); function updateTimerText(){ timerId = setTimeout(function(){ var t =Date.now() - startTime; timerText.innerHTML =(t / 1000).toFixed(2); updateTimerText(); }, 10); } })(); </script> </body> </html> よろしくお願い致します。

専門家に質問してみよう