プログラミング

JavaScriptでYoutubeのURLの変化を監視するには

JavaScriptでYoutubeのURLの変化を監視する場合のメモです。

youtubeは動画を移動するときに、非同期で通信しているので、
ユーザースクリプトなんかが使いにくいです。

HTML(=動画)が変わったらスクリプトを再度実行する、っていう処理をしたい場合は、URLの変化を監視するのがよさそうですが…

通常、hashchangeあたりでできるらしいのですが、

window.onhashchange = function() {
console.log('y')
}

window.addEventListener('hashchange', function(e){console.log('hash changed')});

document.addEventListener("hashchange", function(){cosole.log('y')});

window.onbeforeunload = function(e) {
  return 'Dialog text here.';
};

Youtubeはできないみたいなので、こうするしかないっぽいですね。

var youtubeUrl = setInterval(function(){console.log(document.location.href)} , 1000)

一秒ごとにURLの変化を確認して変化があれば処理をする例:

// 処理*1

var youtubeUrlPrevious = document.location.href

var youtubeUrl = setInterval(function(){
    if (document.location.href==youtubeUrlPrevious){
    } else {
        // 処理*2

        youtubeUrlPrevious = document.location.href
    }
    } , 1000)

処理1がURLが変化する前にしたい処理
処理2がURLが変化したら実装される処理
なので、
基本的には、処理1と2に同じ処理を書くと良いと思います。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です