autoplay属性なしで自動再生される動画をブロックする方法
https://wired.jp/article/vol47-the-world-in-2023-el-nino-is-coming/
上のサイトでは記事の右側に自動再生される動画があります。userscriptでブロックしたかったので、ページのソースを見たのですがvideoタグにはautoplay属性が見当たりませんでした。これはどのように自動再生を実装しているのでしょうか？
<video class="vjs-tech"
webkit-playsinline=""
playsinline="playsinline"
crossorigin="anonymous"
id="vjs_video_1_html5_api"
tabindex="-1"
preload="metadata"
muted="muted"
src="ソース"
...
また以下のようなuserscriptを書いてみたのですが、止まりません。
video.remove()や
video.parentNode.removeChild(video)
も試しましたが、勝手に再構築？されるのか、消えませんでした。
どこが間違っているのか、どうすればブロックできるのか教えてもらえませんか？
// ==UserScript==
// @name Disable HTML5 Videos autoplay/autopreload
// @description Prevent webbrowser from automatically playing/downloading HTML5 videos
// @match *://*/*
// @run-at document-idle
// @require https://gist.github.com/GitHub30/1b13ed6687a22385a81cf98fefdd5a13/raw/42012a345cc5cb1e4f773300e99765b644a40164/async$.js
// ==/UserScript==
async function getVideos(){
try {
var videos = await async$$('video'); //非同期で読み込まれる要素を取得する
console.log("抽出したvideos",videos);
for (var i = 0; i < videos.length; i++) {
const video = videos[i]
video.removeAttribute("autoplay");
video.removeAttribute("loop");
video.setAttribute("preload", "none");
video.pause();
Object.freeze(video.parentNode);
Object.freeze(video);//属性を消した上にfreezeまでしてるのに勝手に再生しやがる！
video.addEventListener('play', function() {
console.log('再生開始',video);
video.pause();
});
video.addEventListener('pause', function() {
console.log('再生停止',video);
});
}
} catch(e) {
console.error("エラー: " + e);
}
};
getVideos()
0