Bilibili-Old终极指南如何一键恢复B站经典界面与翻页评论区功能【免费下载链接】Bilibili-Old恢复旧版Bilibili页面为了那些念旧的人。项目地址: https://gitcode.com/gh_mirrors/bi/Bilibili-Old概述重拾B站经典体验的完整解决方案Bilibili-Old是一个开源项目专门为那些怀念B站旧版界面的用户提供了一套完整的解决方案。这个项目通过浏览器扩展和用户脚本两种方式让用户能够重新体验B站经典的界面设计、播放器布局和评论交互方式。在当前B站不断进行前端界面更新的背景下这个项目成为了许多老用户保持习惯操作体验的重要工具。 问题背景B站前端更新的兼容性挑战界面迭代带来的用户体验断层近年来Bilibili持续对其前端界面进行迭代更新虽然这些更新带来了现代化的设计和新功能但也导致了许多老用户习惯的界面元素和交互方式发生变化。其中最显著的变化包括评论系统重构从传统的翻页评论系统改为瀑布流加载播放器界面变更小电视播放器被新播放器替代页面布局调整主页、视频页、个人中心等页面布局全面更新API接口升级后端接口协议变更影响第三方工具兼容性翻页评论区功能失效的技术分析参考文章中提到的翻页评论区功能失效问题其根本原因在于B站对评论系统进行了灰度测试更新。这种渐进式的前端架构调整导致了DOM结构变更新版评论区采用了不同的HTML结构和CSS类名事件监听失效原有的JavaScript事件绑定机制不再适用API接口调整评论数据获取接口的参数格式和返回结构发生变化样式冲突新旧样式表之间的优先级和覆盖关系改变 技术架构Bilibili-Old的核心实现原理模块化设计架构Bilibili-Old项目采用了高度模块化的设计主要包含以下核心模块src/ ├── core/ # 核心功能模块 │ ├── comment.ts # 翻页评论区实现 │ ├── player.ts # 播放器恢复 │ ├── ui.ts # 用户界面控制 │ └── download.ts # 下载功能 ├── io/ # API接口封装 ├── page/ # 页面适配逻辑 └── utils/ # 工具函数库关键技术实现1. 评论系统恢复机制项目通过拦截和重写B站的评论组件加载逻辑来实现翻页评论区的恢复// 捕获并替换原生的bbComment组件 Reflect.defineProperty(window, bbComment, { configurable: true, set: v { // 自定义评论组件逻辑 Feedback v; this.bbCommentModify(); } });2. 播放器兼容性处理通过DOM操作和样式注入项目恢复了经典的小电视播放器界面3. API请求拦截与重写项目使用JSONP Hook技术拦截B站的API请求并根据需要进行数据格式转换jsonpHook(api.bilibili.com/x/v2/reply?, undefined, (res, url) { // 修复评论翻页数据 if (res.data?.page) { res.data.page.count this.count; } return res; });️ 安装与配置指南两种安装方式选择Bilibili-Old提供了两种安装方式用户可以根据自己的需求选择方式一Tampermonkey用户脚本推荐安装脚本管理器首先安装Tampermonkey浏览器扩展获取用户脚本访问项目的GitCode仓库https://gitcode.com/gh_mirrors/bi/Bilibili-Old获取最新脚本启用脚本在Tampermonkey管理面板中启用Bilibili-Old脚本方式二浏览器扩展安装下载扩展包从项目仓库下载最新的Chrome扩展包加载解压扩展在Chrome扩展管理页面开启开发者模式选择扩展目录点击加载已解压的扩展程序选择解压后的目录功能配置选项安装完成后用户可以通过页面右下角的齿轮图标进行功能配置界面恢复选项选择需要恢复的旧版页面元素评论系统设置启用/禁用翻页评论区功能播放器偏好选择播放器版本和功能选项下载设置配置视频、弹幕下载参数 翻页评论区功能修复详解问题定位与解决方案针对参考文章中提到的翻页评论区失效问题Bilibili-Old项目提供了以下修复方案1. DOM选择器适配更新项目团队分析了B站新版评论区的HTML结构更新了对应的CSS选择器// 新版评论容器选择器 const newCommentContainer document.querySelector(.comment-container); // 旧版评论分页元素选择器 const paginationElements document.querySelectorAll(.comment-page-item);2. 事件监听机制重构重新绑定了评论加载和翻页相关的事件监听器// 重新绑定翻页按钮事件 paginationButtons.forEach(button { button.addEventListener(click, this.handlePageChange); });3. API接口兼容性处理适配B站最新的评论API接口规范确保数据格式兼容// 兼容新版API响应格式 const normalizeCommentData (response) { if (response.data?.replies) { return { comments: response.data.replies, pageInfo: response.data.page }; } return response; };功能恢复效果展示恢复后的翻页评论区具有以下特点传统分页导航恢复经典的页码导航界面评论楼层显示完整显示评论楼层结构快速跳转功能支持按楼层快速跳转排序选项保留支持按热度、时间等排序方式 支持的页面类型与功能全面覆盖的页面恢复Bilibili-Old支持恢复以下页面的旧版界面页面类型恢复状态主要功能视频页面 (av/BV)✅ 完整支持旧版播放器、翻页评论、下载功能番剧页面✅ 完整支持旧版番剧布局、分集列表主页✅ 完整支持经典首页布局、个性化推荐全站排行榜✅ 完整支持传统排行榜界面稍后再看✅ 完整支持旧版稍后再看列表搜索页面✅ 完整支持传统搜索结果布局专栏文章✅ 完整支持旧版阅读体验增强功能特性除了界面恢复项目还提供了多项增强功能弹幕系统增强Protobuf弹幕格式支持弹幕发送者反查功能互动弹幕兼容处理本地弹幕文件加载播放器功能扩展多编码格式切换AVC/HEVC/AV1CC字幕支持分段进度条显示区域限制解除下载功能集成视频文件下载封面图片保存弹幕文件导出字幕文件提取⚠️ 已知问题与注意事项技术限制与兼容性问题页面闪烁现象在恢复旧版页面前新版页面可能短暂显示样式残留冲突新版页面残留的脚本和样式可能影响恢复效果弹幕获取限制原生旧版播放器无法获取90分钟后的弹幕支付功能失效充电、B币支付等功能可能无法正常工作使用建议定期更新建议定期检查项目更新获取最新的兼容性修复功能选择性启用根据实际需求选择性启用功能模块备份重要数据重要操作前建议备份个人数据关注项目动态关注项目更新日志了解最新兼容性状态 未来发展方向技术优化计划性能优化减少脚本对页面加载速度的影响模块化改进进一步提高代码的可维护性和扩展性兼容性增强持续跟进B站前端更新保持功能兼容功能扩展路线更多页面支持扩展支持更多B站页面类型自定义主题提供界面主题自定义功能数据导出增强个人数据导出能力社区功能考虑添加用户配置分享功能 总结与使用建议Bilibili-Old项目为那些怀念B站经典界面的用户提供了一个可靠的技术解决方案。通过精心的代码实现和持续的维护更新项目成功应对了B站前端架构变更带来的兼容性挑战。对于普通用户建议选择Tampermonkey脚本方式安装便于更新维护根据个人使用习惯选择性启用功能模块定期检查项目更新获取最新的兼容性修复遇到问题时查看项目文档或提交Issue反馈对于开发者项目提供了完整的前端逆向工程示例实用的浏览器扩展开发参考API接口分析和处理的最佳实践模块化JavaScript/TypeScript架构设计通过这个项目用户不仅能够恢复熟悉的操作界面还能体验到经过优化的增强功能。无论是怀旧的老用户还是对B站前端技术感兴趣的开发者都能从这个项目中获得价值。记住技术的进步不应以牺牲用户体验为代价。Bilibili-Old项目正是这一理念的实践——在尊重平台发展的同时为用户保留选择的自由。【免费下载链接】Bilibili-Old恢复旧版Bilibili页面为了那些念旧的人。项目地址: https://gitcode.com/gh_mirrors/bi/Bilibili-Old创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考