总结向：Chrome插件 + 网站视频抓取程序go-get-v2升级

技术

这真的是考研前最后的项目了….

前言

之前写的下载程序有一个很大的缺陷，就是api接口需要自己打开开发者工具抓取，然后自己向配置文件中填写，而且一此只能下载一个网站的视频，也就是parser需要手动选取。

之前已经弃坑的，但是对于不完美的东西不能容忍，而且我有一个想法：自己写一个Chrome插件，自动抓取api接口，自动生成配置文件，本地程序读取之后直接进行下载，不需要手动选择什么parser，最多就是确认一下路径

着手开始编写Chrome插件！目前使用的是最新版的Chromev66，感兴趣的可以自行查看Chrome开发者文档，上面写的非常详细，还有一个 User Guide 项目，手把手教你编写第一个插件

项目写下来，我的理解是：使用Chrome浏览器提供的一系列api，使用进行javascript编写的，在Chrome后台运行的脚本

以下列举一些项目中使用到的api

使用接口chrome.runtime.openOptionsPage和chrome.runtime.getURL实现对options页面的打开
使用接口chrome.webRequest.onSendHeaders.addListener监听http请求，抓取需要的请求
使用接口chrome.contextMenus.create 和 chrome.contextMenus.onClicked.addListener 设置右键菜单的内容，效果如下

使用接口chrome.runtime.onMessage.addListener和chrome.runtime.sendMessage实现后台运行的不同脚本之间的信息交互
使用接口chrome.downloads.download实现对生成的json文件的保存，效果如下

如果是逻辑比较复杂的建议使用typescript，分文件进行编写，最后使用webpack编译打包，对于页面的呈现，建议使用一个前端UI框架

对于将数据写到本地文件中，可以使用javascript的Blob对象生成一个url，再使用chrome的下载api进行下载，如下

1
2
3

let blob = new Blob(["Hello world"], {type: "plain/txt"})
let url = URL.createObjectURL(blob);
chrome.downloads.download({url: url, saveAs: true})

对与使用chrome.runtime.onMessage和chrome.runtime.sendMessage进行信息的交互，建议使用typescript规定特定的格式，这样子项目复杂起来之后就不会乱了