1. 油猴脚本入门为什么选择它来下载B站视频第一次接触油猴脚本时我也被它的强大功能震撼到了。简单来说油猴脚本就像给你的浏览器装了个外挂能够自定义修改任何网页的显示内容和功能。相比传统下载工具它有三大不可替代的优势首先是不需要额外安装软件。你只需要在Chrome或Edge浏览器安装Tampermonkey扩展俗称油猴然后导入脚本就能立即使用。我实测从零开始到能下载视频整个过程不超过3分钟。其次是绕过B站的前端限制。B站官方为了保护版权网页端做了很多防下载措施。但油猴脚本运行在页面加载完成后可以直接访问视频的原始数据接口。去年我帮朋友下载教学视频时就发现即使需要大会员权限的内容也能轻松获取。最重要的是灵活性。你可以随时修改脚本代码比如我经常根据需求调整下载按钮的位置和样式。下面这段代码就是典型的油猴脚本元数据声明定义了脚本的运行范围和权限// UserScript // name B站音视频下载器 // namespace http://tampermonkey.net/ // version 1.0 // description 分离下载B站视频和音频 // author YourName // match https://www.bilibili.com/video/* // icon https://www.bilibili.com/favicon.ico // grant GM_xmlhttpRequest // /UserScript2. 环境准备安装必备工具工欲善其事必先利其器。在开始写代码前我们需要准备好开发环境。这里我推荐使用VSCode作为编辑器它的JavaScript语法提示和代码调试功能非常完善。第一步安装Tampermonkey打开Chrome网上应用店搜索Tampermonkey点击添加到Chrome完全免费安装后浏览器右上角会出现猴子图标第二步配置开发环境新建一个空白脚本Tampermonkey会自动生成基础模板。我建议开启以下设置在管理面板中启用允许访问文件URL开启开发者模式以便实时调试禁用缓存避免修改不生效常见问题排查如果脚本不运行可以检查是否在正确的域名下触发match设置浏览器控制台是否有错误提示脚本是否被意外禁用我遇到过最棘手的问题是B站改版导致选择器失效后来通过增加// run-at document-end元数据解决了加载时机问题。3. 解析B站视频数据结构要下载视频首先得知道视频数据藏在哪里。经过多次抓包分析我发现B站现在主要使用两种数据格式1. INITIAL_STATE对象包含视频基础信息通过这段代码可以获取const { aid, bvid, cid } window.__INITIAL_STATE__.videoData2. __playinfo__对象存储音视频流信息结构如下{ dash: { video: [{ base_url: https://xxx.com/video.m4s, bandwidth: 1500000 }], audio: [{ base_url: https://xxx.com/audio.m4s }] } }实战技巧使用JSON.parse(JSON.stringify())深拷贝对象避免污染通过Array.sort()按带宽排序选择最高清版本添加try-catch防止接口变更导致脚本崩溃去年B站将flv格式切换为dash时我的脚本就因为没有处理异常导致大批用户报错。后来增加了格式兼容判断function getVideoUrl(playinfo) { return playinfo.dash?.video[0]?.base_url || playinfo.dash?.audio[0]?.base_url || playinfo.dash?.video?.baseUrl // 兼容旧版 }4. 核心功能实现音视频分离下载这个章节我会手把手教你实现最关键的下载功能。B站将音视频分开存储正好给我们提供了更灵活的选择。4.1 获取Blob对象使用Fetch API获取媒体流async function fetchMedia(url) { const response await fetch(url, { headers: { Referer: https://www.bilibili.com/, Origin: https://www.bilibili.com } }) if (!response.ok) throw new Error(网络请求失败) return await response.blob() }4.2 创建下载链接将Blob转为可下载URLfunction createDownloadLink(blob, filename) { const url URL.createObjectURL(blob) const a document.createElement(a) a.href url a.download filename a.click() setTimeout(() URL.revokeObjectURL(url), 1000) }4.3 动态UI实现在页面右上角添加下载按钮function addDownloadButton() { const btnGroup document.createElement(div) btnGroup.style.position fixed btnGroup.style.top 100px btnGroup.style.right 20px btnGroup.style.zIndex 9999 const videoBtn createButton(下载视频, () { // 视频下载逻辑 }) const audioBtn createButton(下载音频, () { // 音频下载逻辑 }) btnGroup.append(videoBtn, audioBtn) document.body.appendChild(btnGroup) }性能优化技巧使用Promise.all并行下载音视频添加下载进度提示实现断点续传通过Range头5. 高级功能与异常处理一个健壮的脚本需要处理各种边界情况。以下是几个实战中总结的经验5.1 多P视频处理通过遍历pages数组获取所有分Pconst pages window.__INITIAL_STATE__.videoData.pages pages.forEach((page, index) { console.log(第${index 1}P CID: ${page.cid}) })5.2 大会员专属内容添加Cookie认证fetch(url, { headers: { Cookie: SESSDATA${encodeURIComponent(你的SESSDATA)} } })5.3 常见错误码处理412请求被B站风控拦截404视频不存在或下架403权限不足建议的错误处理流程try { // 尝试获取数据 } catch (err) { if (err.message.includes(412)) { alert(触发B站安全限制请降低请求频率) } else { console.error(未知错误:, err) } }6. 界面优化与用户体验好的用户体验能让脚本用起来更顺手。我通常会添加这些功能6.1 加载状态提示function showLoading(text) { const el document.createElement(div) el.className bili-downloader-loading el.innerHTML span${text}/span document.body.appendChild(el) return () el.remove() } // 使用示例 const hideLoading showLoading(正在下载音频...) await fetchAudio() hideLoading()6.2 自定义下载命名支持模板变量function getFilename(format, videoInfo) { return format .replace({title}, videoInfo.title) .replace({bvid}, videoInfo.bvid) .replace({quality}, videoInfo.quality) }6.3 记忆用户设置使用GM_setValue存储偏好// 保存 GM_setValue(download_path, /Downloads/B站视频) // 读取 const path GM_getValue(download_path, 默认路径)7. 脚本发布与维护开发完成后你可以选择将脚本分享给更多人7.1 发布到GreasyFork注册GreasyFork账号点击新建脚本粘贴完整代码并填写描述7.2 自动更新配置在元数据中添加// updateURL https://example.com/yourscript.meta.js // downloadURL https://example.com/yourscript.user.js7.3 版本更新策略建议采用语义化版本主版本号重大架构调整次版本号新增功能修订号问题修复维护过程中我建立了这些好习惯使用Git管理版本保留兼容旧版API的代码在脚本开头添加联系方式方便用户反馈8. 法律与道德注意事项最后必须强调几个重要原则仅限个人学习使用不要在脚本中添加破解会员等违法功能尊重UP主劳动成果下载后不要二次上传或商用添加版权声明console.log(本脚本仅供学习交流下载内容请勿传播)最近我就收到过B站的法务通知因为某个用户用脚本批量下载后上传到其他平台。后来我在脚本中增加了下载频率限制每小时不超过10次请求。如果你只是想收藏喜欢的视频建议下载后保存在本地优先选择720P等非高清版本支持原创UP主的充电计划