关于监听后的劫持

thediy

大佬们好，还是在折腾网课培训的中年小白又来了。

上个月我在https://bbs.tampermonkey.net.cn/thread-3874-1-1.html
发了一个提问。实际上这个培训早就结束了，但我现在放假有空仍在折腾。
当时提的几个问题有的已经搞清楚了。

现在还有一个问题搞懂了一小半。
就是关于页面不在最前时，视频会停止播放的问题。

我看到大佬回复用addeventlistener劫持。于是也看了一些关于addeventlistener的视频和实例，但似乎跟我要求的都不太一样。我写了一段监听的（其实都是半抄半写的）

document.addEventListener("visibilitychange", function () { if (document.hidden) { console.log("隐藏"); } else{ console.log("显示") } });

现在只能输出 状态。又写了一段关于定时器强行播放的

setInterval(function () { var current_video = document.getElementsByTagName('video')[0] current_video.play()}, 500)//无视最小化，但放完会重头放

这个虽然可以播放下去，但是不利于 后面跳到下一课。
之后我发现原网页中本来就监听了且打印出来

所以我第一段代码其实没什么用，跟原网页是重复的。我只监听了页面状态变化，却无法改变视频停止的状态。因为当页面恢复visible时，视频仍然是停止的，要点一下播放才会继续。

那我要怎么劫持原网页的监听呢？
我看了道哥B站的第三十一讲 addEventListener介绍与劫持
用了
EventTarget.prototype.addEventListener=function(){ console.log('我被劫持了') }
这下把所有的监听都劫持了，油猴跑不了了，连视频播放前的弹窗都点不下去。
还是说，我也监听视频播放的状态，每当发现停止，就去点击播放？这样似乎跟强行播放没什么区别？
请大神们指点一二，我已经查过好多资料了，还是没有找到比较有用的，可能我使用的关系字不对。

cxxjackie

这个不叫劫持，addEventListener是正常的添加监听事件，劫持是对原有事件做修改。setInterval可以通过clearInterval停止，所以你的问题可以在视频播放完毕后clearInterval，然后跳转下一页，不过这个方案也不够好，因为浏览器会在网页休眠期间调大定时器的时间间隔，可能造成视频播放断断续续，最好是直接监听暂停事件：

1. const video = document.querySelector('video');
   
2. // 监听暂停事件
   
3. video.addEventListener('pause', e => {
   
4.     video.play();
   
5. });
   
6. // 监听播放完毕事件
   
7. video.addEventListener('ended', e => {
   
8.     // 这里写跳转下一页的代码
   
9. });

复制代码

李恒道

c大答得差不多了

我就补一个小问题吧
结束事件实测会有一些bug
有些视频好像因为编码问题会卡在最后一秒
比如2分51秒只能播放到2分50秒
最后一秒虽然在播放但是永远播放不完
目前找到比较好的一点方案是禁止掉暂停按钮之后
监听视频的播放进度
如果达到一定的百分比或时间不改变了就跳

thediy

cxxjackie 发表于 2023-1-20 22:28
这个不叫劫持，addEventListener是正常的添加监听事件，劫持是对原有事件做修改。setInterval可以通过clear ...

感谢二位大佬的回答。

那这是对暂停后的继续播放。这样可能会卡顿。
有没有办法劫持原网页的监听，使它不知道处于hidden状态
也就不会暂停。

应该怎么实现呢？

李恒道

thediy 发表于 2023-1-25 16:48
感谢二位大佬的回答。

那这是对暂停后的继续播放。这样可能会卡顿。

https://bbs.tampermonkey.net.cn/ ... ;highlight=addevent
过滤掉对应的事件监听器

李恒道

thediy 发表于 2023-1-25 16:48
感谢二位大佬的回答。

那这是对暂停后的继续播放。这样可能会卡顿。

对了
即使你过滤掉了最小化的问题
浏览器页面被隐藏后会进行性能处理
类似于问题参考
https://bbs.tampermonkey.net.cn/ ... thread&tid=1987

cxxjackie

thediy 发表于 2023-1-25 16:48
感谢二位大佬的回答。

那这是对暂停后的继续播放。这样可能会卡顿。

这个卡顿很小的，你都挂后台了，小卡一下应该无所谓吧。阻止暂停有很多种思路，具体要看他代码怎么实现的，除了移除对应监听器（这个是最麻烦的），如果代码读取的是document.hidden的状态，可以对hidden的读取做劫持：

1. Object.defineProperty(document, 'hidden', {
   
2.     get: () => false
   
3. });

复制代码

更简单粗暴的是把视频的暂停方法弄没：

1. video.pause = () => {};

复制代码