Bilibili 旧播放页

恢复Bilibili旧版页面,为了那些念旧的人。

< 腳本Bilibili 旧播放页的回應

評論:正評 - 腳本一切正常

§
發表於:2023-06-18
編輯:2023-06-18

脚本非常好用,值得推荐!
(我很抱歉在这里向您提问,但我找不到别的联系方式了,实在抱歉)
大佬您好,我最近想和您做同样的事,但是把页面恢复到18版,我近期实现了把修改Cookie让网页回到旧版的功能(详见:https://www.bilibili.com/video/BV1iu411p7tm),但B站终究最终会关闭旧版页面,并且我的水平很差,
所以,我想请教一下您,是如何寻找、重构旧版页面的,
我的电子邮件是:han121010@yeah.net
我的QQ是:1534629558
如果您乐意告诉我,我感激不尽,请与我联系。如果您不乐意,则请您无视这条消息

§
發表於:2023-06-19

寻找的话:如果旧版页面还能获取,那就直接保存对应的html文件,如果不行,就去Wayback Machine获取对应日期的存档(当然得手动剔除Wayback Machine相关的内容)

如何重构:把上面的旧版html文件解析为DOM树,然后替换当前DOM树就行,当然可能需要一些额外处理以保证html里的js脚本能正常执行且不报错。

概括一下本脚本旧版html文件解析方式的流变:

  1. 脚本远古时期直接暴力地使用document.write方法刷新DOM,导致了很多兼容问题……
  2. 如今使用的手动解析出所有的元素并使用document.createElement一一创建并替换到当前DOM树的方法。

可以参考代码历史记录一步一步的演变流程,当前源代码仓库指路-> https://github.com/MotooriKashin/Bilibili-Old

很乐意提供帮助,无论是继续本话题下回复,还是到GitHub的issue里讨论。

§
發表於:2023-06-28

您好, 今天我打开了这个网页查看了一下B站2019年3月15日的旧版界面 但,界面貌似是纯文字的,如下图: 图片 我访问2014年的B站就是正常的, 这是怎么回事?

§
發表於:2023-06-29

大概是你的网络问题

§
發表於:2023-07-03

最近B站的旧版(18版)界面越来越难进入了,所以我的开发进程必须得加快了,
有些小事就直接请教您了(因为查不到,还有我在这方面纯属是个小白,哎......),实在是抱歉。
请问DOM树到底如何从HTML文件中解析呢?
手动解析肯定是很困难的,因为......我连DOM树的格式都不知道,还有一个就是HTML虽然懂一点,但是难免会有一些不会的和错误。
所以我尝试了一下使用AI,
我首先把HTML代码给了ChatGPT,NewBing这类的AI,但它们都很傻......根本不知道我意思,
之后我去找了百度的文心一言试了一下,它有2000字符的限制,所以生成了一部分,但是没完全好。
有软件能从HTML中自动解析出DOM树吗?
还有就是,B站网页DOM树怎么通过代码替换?看您之前发的消息,意思貌似是每条每条手动替换,那么......也有点困难啊......
(实在抱歉没去看源码,一是看不懂,二是根本不知道包含这些内容的代码在哪个文件里...........)

§
發表於:2023-07-03

最快的办法应该是

document.documentElement.innerHTML = `<head>...</head><body>...</body>`

也就是把headbody两个标签赋值给document.documentElement.innerHTML
但这样位于headbody里的script标签并不会运行!
所以在赋值前应该把所有的script标签剔除,并在赋值后一一手动运行:

// 例如:剔除出来的`script`标签是这样几个:
// <script type="text/javascript" src="//static.hdslb.com/js/jquery.min.js"></script>
// <script type="text/javascript" src="//static.hdslb.com/js/jquery.qrcode.min.js"></script>
// <script type="text/javascript" src="//static.hdslb.com/js/swfobject.js"></script>
const fragment = document.createDocumentFragment(); // 先提供一个容器
// 添加第1个脚本
const node1 = document.createElement('script');
node1.src = '//static.hdslb.com/js/jquery.min.js';
node1.async = false;
fragment.append(node1);
// 添加第2个脚本
const node2 = document.createElement('script');
node2.src = '//static.hdslb.com/js/jquery.qrcode.min.js';
node2.async = false;
fragment.append(node2);
// 更多脚本依法炮制

// 添加完所有脚本后
document.body.append(fragment);

如果控制台没有报错,到这一步就基本完成了。否则根据报错原因再去找解决办法吧。

ps: 直接写脚本的确是一个学习JavaScript的好办法,我也是这么过来的,而这个项目也是我学习JavaScript的起因。在此期间收到了很多大佬的帮助,实在感激不尽。如果能够帮助到你,那是我的荣幸。本项目是VSCode里的Typescript项目,你可以克隆到本地使用VSCode打开,VSCode强大的提示功能应该会更有帮助。

發表回覆

登入以回復