关于B站(bilibili)对未登录用户视频观看进行暂停和弹窗的分析与简单解决方案

  • 情况介绍
  • 简要分析
  • 初步的解决方案
  • 总结(太长不看点这里)

情况介绍

于近日的某次更新后,B站(bilibili)网页端出现了一个新功能:当用户没有登录时,将对每个视频间隔性地(目前的情况是视频开始播放后的1分钟)进行自动暂停并弹出登录窗口。不得不说,这个功能使得使用体验极差,每个视频都要经历暂停和弹窗实在是让人不爽。有些时候,仅仅只是在B站上看几个视频,或是挂着听听歌,再者也可能试着避开大数据推送和账号的绑定。总之,登录也许不是时时刻刻必须的,而通过恶心用户、严重降低用户体验来迫使用户进行某些操作从而为在线或推广等做出贡献,也许并不是一个好主意。通过一些简单的探索和尝试,这里给出一个非常初级的分析和解决方案,供没有意愿次次登录的用户们参考。

简要分析

通过浏览器F12的网络模块,暂停弹窗事件发生的前后没有特殊的网络请求,可以初步判断出这个功能是在页面加载时引入的JS实现的,并不存在使用与远程服务器交互的内容,如使用心跳包报告用户情况并实时加载JS等,暂时没有发现。也就是说,不太能通过阻止网页向某个URL发送请求或是修改数据包内容来解决这一问题。
既然很可能是网页加载时引入的JS实现的,于是通过edge禁止部分JS加载的debug模式,排查出所属的文件。经验证,该功能存在于来自s1.hdslb.com的stardust-video.****的js文件。当禁止该js加载时,不再出现自动暂停和弹窗的情况。然而,虽然视频可以继续播放,弹幕也没有问题,但是评论区、头像、及右侧推送区的加载出现了异常。这也是可以预见的,很显然是一个压缩后的综合性JS文件,并不可能单独实现这一功能。也因此,禁止该文件的引入虽然能解决所述的问题,但仍然影响着用户的正常使用和体验。
于是想到换一下思路,如通过重写同名函数覆盖该功能。遗憾的是该文件是经过压缩混淆的生产环境文件,内容太多太杂,实现的功能较多,难以定位(例如,搜索setTimeoutset和setInterval可以得到成百上千的结果)。尝试过简单的反混淆工具,也未能得到易于解读的效果。
由于精力有限,上面几条不易走通的道路没有继续尝试了,想做一个简单的用户脚本自己凑合用吧。虽然B站使用了特殊的架构,与一般的video属性不太一致,但是模拟点击操作总是没问题的,能使得视频继续播放就是。唯一需要操心的是如何分别用户自行的暂停和被脚本进行的暂停,一个简单的方式就是判断弹窗,用户自行暂停一般不会出现弹窗,而网页进行的暂停和弹窗总是伴随出现的。

初步的解决方案

根据以上的分析,一个简单的思路就是判断视频暂停的同时是否出现了B站的登录弹窗。通过审查元素可以发现,当视频暂停时,一些模块的class会出现变化,可以利用这一点,监听该元素的属性变化。经过检查,最后发现比较适合的是一个class为bpx-player-row-dm-wrap的元素,其在暂停和播放状态切换只涉及到一个class的增加和减少(即bili-paused),比较适合监听。其他元素,如bpx-player-container,状态变化较多,有时监听会出现一些意外情况。而弹窗的元素较为好判断,会伴随着覆盖网页的mask出现。关闭弹窗和续播视频的功能直接调用click来完成,应该可以初步实现正常续播的功能。

这里使用MutationObserver来监听元素属性变化完成相关功能:

var target = document.getElementsByClassName("bpx-player-row-dm-wrap")[0];
var config = {attributes: true, attributeFilter: ["class"]};
var observer = new MutationObserver(function(motationList, observer) {// console.log("captured!");setTimeout(function(){if (document.getElementsByClassName("bili-mini-mask").length > 0) {document.getElementsByClassName("bili-mini-close-icon")[0].click();document.getElementsByClassName("bpx-player-ctrl-btn bpx-player-ctrl-play")[0].click();// observer.takeRecorders();} }, 1000);
});
observer.observe(target, config);

需要解释的是,MutationObserver回调函数使用setTimeout是为了等待属性加载,调试发现视频会先暂停然后网页弹窗,第一时间检测元素有时并不能检测到。好吧这个策略并不优雅,但是实际用起来还行。

总结(太长不看点这里)

目前来看,阻止网络请求/禁用部分JS/复写相关函数的难度还是比较大的,简单的方法就是文中所提到的检测暂停并自动续播。这里把自用的脚本分享一下(我自己只是开个页面挂着听歌,偶尔看个视频,用起来没什么问题,总比歌放了一分钟就要暂停然后回去点两下好多了,不过离完全解决肯定还是差挺多的,凑合用吧):

去安装浏览器脚本

关于B站(bilibili)对未登录用户视频观看进行暂停和弹窗的分析与简单解决方案相关推荐

  1. B站(bilibili)对未登录用户视频观看进行暂停和弹窗的分析与简单解决方案

    怎么说呢,这个方法发出来也不知道多快被和谐. 所以也不知道会不会直接就加入强行更新和谐的方法,毕竟用户只是使用方. 水那么一下只是为了吐槽我找了两个小时没人给出答案. 也是对B站限制登录的营销手段有点 ...

  2. Spring Filter过滤器,Spring拦截未登录用户权限限制

    实现的功能:判断用户是否已登录,未登录用户禁止访问任何页面或action,自动跳转到登录页面. 比较好的做法是不管什么人都不能直接访问jsp页面,要访问就通过action,这样就变成了一个实实在在的权 ...

  3. jsp中未登录用户也可以浏览页面的功能实现代码

    jsp中未登录用户也可以浏览页面的功能实现代码 <%!                int count=0;               %>                  < ...

  4. html页面怎么判断未登录,未登录用户.html

     未登录用户 $axure.utils.getTransparentGifPath = function() { return 'resources/images/transparent.gif'; ...

  5. js实现未登录用户跳转到登录页面登录完成后返回原页面

    首先要获取未登录用户浏览的当前页面的路径: var preUrl=window.location.href; 在提示登录的跳转链接里利用url传参: window.open("../logi ...

  6. B站用户视频观看记录的存储方案

    中午上B站看视频的时候,突然好奇B站的视频观看记录是怎么存的. 首先,因为多端观看的视频记录都是同步的,即不管是在手机观看,还是网页观看,还是新设备观看,视频都是可以直接跳转到上次的观看位置的,所以这 ...

  7. SpringBoot——使用拦截器拦截未登录用户

    前置知识SpringBoot配置拦截器基于HandlerInterceptor接口实现,关键三个方法 preHandle()执行目标之前 postHandle()执行目标之后 afterComplet ...

  8. 基于 WebSocket 的实时通告功能,推送在线与未登录用户

    在我们以往的软件或者网站使用中,都有遇到过这种情况,莫名的弹出广告或者通知!而在我们的业务系统中,有的时候也需要群发通知公告的方式去告知网站用户一些信息,那么这种功能是怎么实现的呢,本 Chat 将使 ...

  9. struts2拦截器--拦截未登录用户

    拦截器是动态拦截Action调用的对象.它提供了一种机制可以使开发者可以定义在一个action执行的前后执行的代码,也可以在一个action执行前阻止其执行,同时也提供了一种可以提取action中可重 ...

最新文章

  1. 浅谈 sessionStorage、localStorage、cookie 的区别以及使用
  2. VTK:椭圆圆柱用法实战
  3. linux下常用的关机命令有:shutdown、halt、poweroff、init;重启命令有:reboot。下面本文就主要介绍一些常用的关机命令以及各种关机命令之间的区别和具体用法。
  4. [Umbraco] 创建第一个页面
  5. MySql创建一个存储过程
  6. list(链表)容器
  7. 《深入理解Java虚拟机》第1,2章
  8. 大专学历造假改成了 211 拿到了抖音 Offer
  9. countable php,ThinkPHP容器之Countable巧用
  10. android 手机头提示消息,正确的手机头部声明(android,iphone)
  11. 微信开发者工具历史版本下载
  12. Quartz——CronTrigger触发器
  13. 服务器u盘pe制作,u盘winpe启动盘制作
  14. 笔记本电脑怎么拆开后盖_新手怎么拆解笔记本?笔记本拆机注意事项 (全文)
  15. 什么是 Docker ?
  16. 深度学习之数据标准化方法综述
  17. (三)CGAL库应用:仿射变换(点的旋转、平移、放大)
  18. 厦门大学计算机科学专业,2018厦门大学计算机科学系考研招生信息汇总
  19. 2021/09/06 Terraform 从入门到精通(二)
  20. 方便快捷,浏览器利器——Vimium(详解)

热门文章

  1. jmeter参数化(csv文件)
  2. 《Pandas Cookbook》第02章 DataFrame基本操作
  3. gitlab+jenkins自动化打包APK
  4. 在Eclipse中 Web项目 插入背景图片
  5. 【愚公系列】2023年06月 攻防世界-Web(i-got-id-200)
  6. 递归算法2——简单递归之斐波那契数列(递归法)
  7. TYK配置SSL方案
  8. 《PHP程序员面试笔试宝典》——如何应对面试官的“激将法”语言?
  9. Ti的C28x系列的DSP(28069)(28377)使用经验,ADC经验
  10. 5、设计模式之原型模式