说明:#原创# 标签为IT之家在IT圈所设的投稿栏目,具体投稿规则点此查看

在IT之家《微软Edge 83浏览器稳定版发布:支持扩展程序同步》一文的评论区,有位网友询问我这个扩展的开发时间用了多久,现在在IT圈发个帖子回答一下。

这是微软 Edge 浏览器简易扩展的商店下载链接,其实在谷歌 Chrome 扩展商店也有上架,为了这个扩展还花了5美金去做Chrome扩展开发者认证🐶。

这里是GitHub开源项目主页

首先,给吃瓜的访客说一说下文提到的名词:

UA、ua:User-Agent的简写,这个信息包含了用户的操作系统,浏览器类型和浏览器版本号。浏览器每次发起网络请求都会携带这个信息,让服务器识别后返回对应的内容。

常见的用法是电脑浏览器和手机浏览器访问同一个网址,服务器识别后可以返回不同的网页内容,浏览器本身没有针对不同域名的使用不同的UA的功能

Cookies:服务器用于识别用户的数据,服务器会在响应浏览器发起的网络请求后返回给浏览器存储,浏览器本身需要根据域名分别存储这些Cookies

API、api:接口,在本文里的含义是允许开发者通过使用 api 接口改变 Chromium 系浏览器的某些功能。

做微软 Edge 浏览器的扩展就花了一天,是真的,因为我已经在Chrome那边做好一个了,花一天抄过来就行了😂。

其实从提取需求到实际做出来,酝酿了很久很久,开发时间在大半年左右,一直维护到现在。

===============后面是这个扩展的功能介绍和截图==========

因为在 Chromium 系的浏览器上,切换 ua 的扩展很多很多,甚至 Chromium 开发者工具里的原生功能就可以做到。

但是原生功能和已有的扩展在改变ua后访问所有网站都会受到影响,并不满足我的需求。

因此自己做扩展,第一个版本必须要满足自己的需求,因为只有自己清楚自己需要什么功能。

我自己的需求是需要给不同的域名独立设置不同的 ua,例如让网站 A 以为我在使用 macOS 的 Safari 的 ua,让网站 B 以为我在用安卓手机的Chrome。

为了可以快速切换 ua ,还需要在网页的右键菜单实现了 ua 切换功能(吐槽一下 Chromium 右键菜单的 api 很拉垮)。

众所周知各个系统的浏览器更新还是比较频繁的,不可能随时更新扩展里自带的ua信息,还需要做自定义功能。

甚至可以告知别人网站的服务器我在用鸿蒙系统 🌹🐔。

自己实现每个域名都可以独立 ua 真的很难,需要使用 Chromium 的 api 监听整个浏览器的所有网络请求,如果网络请求的域名符合用户的设置再修改这个网络请求的 ua。因此这个扩展需要用到很敏感的权限,每次更新这个扩展,Chrome 的扩展商店审核时间都在 3 天以上。

简单理解上面那段话就是:给 ithome.com 设置了一个 ua ,打开 ithome.com 的网页后,网页里面以 ithome.com 域名的资源(例如图片和js脚本)都会使用这个ua进行读取。

以上总结下来就一句话,就是可以简单的设置每个域名的UA这一个功能,但这么一句话就涉及到了:

1、需要监听所有网络请求,通过网络请求网址里的域名来匹配用户的设置

2、因为监听所有网络请求这个权限很敏感,因此 Chrome 扩展商店的审核时间比普通的扩展要长两三天,这两三天还有审核不通过的可能,挺提心吊胆的。

3、要面对 Chromium 很拉垮的右键菜单

4、浏览器右上角的扩展图标点开后的更高级一点的界面

5、在每个扩展都有的独立页面里再做一个更友好的设置界面

这仅仅只是一个更改UA的功能。

· 快速切换Cookies

这个功能是用来切换网站账号的,放个截图就不细说了🐶,删除已保存的Cookies功能需要去扩展的独立页面。


以下两个功能都是在监听所有网络请求的基础上增加的,属于小众功能,需要有一些开发基础才能用得来,简单说说:

· 网址监听

这个功能是用来弥补 Chromium 开发者工具的 Network 监听功能的。

用过 Chromium 开发者工具监听网络请求的人都有这个经验,一个网页打开后,才记起要打开开发者工具看网络请求,这就需要打开Chromium 开发者工具后再刷新网页了

这个扩展的设置好后就会开始监听,不再需要打开 Chromium 开发者工具后再刷新页面了。

· 网址改写功能

将符合规则的网络请求重定向到指定到网址,涉及到正则匹配等知识,极其小众的功能;因此还做了一个辅助编写规则的小工具,网址匹配表达式测试工具,太懒了只做了英文的🐶。

这个匹配表达式是自动将所有百度的搜索都重定向到用必应搜索,全自动24小时工作,妙啊。可以打开这个链接把表达式抄到扩展试试。