V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
爱意满满的作品展示区。
gzlock
V2EX  ›  分享创造

我也发一个 Chrome 扩展,功能主治: Cookies 切换, UA 切换,简单的网址监听

  •  1
     
  •   gzlock ·
    gzlock · 2019-01-30 19:44:24 +08:00 via Android · 6204 次点击
    这是一个创建于 2152 天前的主题,其中的信息可能已经有所发展或是发生改变。

    由于是第一次开发 Chrome 扩展,manifest.json 申(抄)请(来)了多余权限,0.6 版已经精简了权限,Chrome 商店已经在审核中

    介意权限的 v2er,可以前往 Github 自行使用

    Cookies 切换

    快速切换网站的 Cookies

    例如可以满足多个 V2EX 账号快速切换的需求

    截图

    截图

    User-Agent 切换(非全局切换)

    根据当前 Tab 打开的网页的域名,来识别是否需要把标签的所有网络请求切换为某个 UA,而不是整个 Chrome 全局切换

    而又因为作用于整个 Tab 的所有网络请求,不论是否同域的网络请求都会切换为某个 UA

    举例:

    A.com 的 UA 切换到 Android Chrome

    那么 A.com 网页里读取的 B.com/xxx.png 的图片网络请求也会将 UA 切换为 Android Chrome

    有点绕口😂,但就是基于这个需求出发的

    屏幕快照

    屏幕快照

    简单的网址监听

    如果没有主动打开 Chrome 的开发者工具,就需要打开开发者工具再刷新页面才能看到所有的网络请求

    这个功能就是简化这个操作

    截图

    链接

    Chrome 商店页面

    开源:Github

    第 1 条附言  ·  2019-01-30 21:51:12 +08:00

    介绍一下这个Chrome扩展的代码

    类的关系

    屏幕快照

    这个mind map Github链接,带黄色小标签的节点有文字注释

    mmd文件可以用Idea的插件 浏览

    类的作用

    自定义类 Setting 包装了Chrome原生API chrome.storage.local 的一些功能,是用来存储数据的

    类的data成员是JSON对象,以域名为键,值为{cookies, ua, requests},用Chrome API Chrome.storage.local.get(null) 读取整个扩展的存储数据

    类的init方法,监听了 chrome.storage.onChanged ,用于同步Chrome正常模式和Chrome隐身模式的自定义数据


    自定义类 ExtensionEvent 是自定义事件

    使用Chrome原生api 监听事件:

    1. 监听Tab打开网页:chrome.webNavigation.onBeforeNavigate
    2. 监听Tab的网络请求:chrome.webRequest.onCompleted
    3. 监听Tab关闭:chrome.tabs.onRemoved
    4. 监听Tab的切换:chrome.tabs.onActivated
    5. 监听Tab的状态变化:chrome.tabs.onUpdated
    6. 监听Chrome窗口切换:chrome.windows.onFocusChanged

    组装成四个自定义事件:

    • tab_start(1的事件参数parentFrameId为-1时触发)
    • tab_load (1的事件参数parentFrameId不等于-1时触发,2)
    • tab_update(4,5,6)
    • tab_close(3)

    自定义类 Tabs 为Chrome的右键菜单工作


    自定义类 Tabs 为整个扩展的核心类,大致的工作流程:

    • 监听自定义事件 tab_start 用于一个Tab开始打开网页(parentFrameId为-1),提取打开的网页的域名,写入到Tabs类的成员data(JSON对象),以Chrome Tab id 为键,值为{domain, text, urls},domain是主域,text是Chrome扩展小图标的badge文本(那个下标小数字),urls是监听到的网址数组

    • 监听自定义事件 tab_load 用于检查所有请求是否符合简单的网址监听的设置,符合就添加到Tabs.data[tab id].urls里,并且更新Chrome browser action的图标bagde文本,就是那个下标数字

    • 监听原生API chrome.webRequest.onBeforeSendHeaders,以Tab id和domain判断是否需要更改UA

    • 监听自定义事件 tab_update 用于更新右键菜单,由于Chrome没有显示Chrome菜单之类的事件,只能在后台主动刷新菜单内容

    • 自定义事件 tab_close, 删除 Tabs.data[tab id]

    一些utils源码就不介绍了,源码有一些注释帮助理解

    第 2 条附言  ·  2023-08-15 22:22:12 +08:00

    前往 Edge扩展商店页面 安装

    26 条回复    2024-05-17 21:09:57 +08:00
    nolo
        1
    nolo  
       2019-01-30 20:30:59 +08:00 via Android
    看起来很不错,支持,回去试一下。
    jason94
        2
    jason94  
       2019-01-30 21:49:16 +08:00
    等会试一试
    gzlock
        3
    gzlock  
    OP
       2019-01-30 21:54:36 +08:00
    @nolo #1
    @jason94 #2 在帖子里 Append 了这个扩展一些代码的介绍,希望可以对开发 Chrome 扩展的 v2er 带来一些启发和帮助
    Tink
        4
    Tink  
       2019-01-30 21:56:45 +08:00
    能支持 host 切换么,比如一个 ip,传入不同 host
    benedict00
        5
    benedict00  
       2019-01-30 22:10:00 +08:00 via Android
    等 Firefox 扩展,支持一个
    IsaacYoung
        6
    IsaacYoung  
       2019-01-30 22:20:17 +08:00 via iPhone
    支持一下
    myjava
        7
    myjava  
       2019-01-30 23:01:18 +08:00
    https://www.chromefor.com/%E7%AE%80%E6%98%93%E6%89%A9%E5%B1%95_v0-4/

    相当的赞,支持一下。已经同步到国内多节点下载
    kersbal
        8
    kersbal  
       2019-01-30 23:33:22 +08:00 via iPhone
    赞,下下来试试
    gzlock
        9
    gzlock  
    OP
       2019-01-30 23:43:26 +08:00
    @Tink #4 从 Chrome 商店有这类型的扩展来看是可以实现的,如果可能或许大概会做这个功能吧
    @benedict00 #5 在 FF 65 试了一下,正常模式勉强可以使用
    但有以下问题:
    1. 正常模式下,网页右键菜单的保存 Cookies 功能无效,没有弹出保存名称输入框的。
    只能用扩展小图标里的保存按钮(那个+号)来保存 Cookies
    2.在 FF 的 [隐私窗口] 下 popup 页面调用 chrome.extension.getBackgroundPage()会返回 null
    用 moz 文档说的 browser.extension.getBackgroundPage()一样的问题,返回 null
    3.FF 组件的调试功能会崩溃,需要重启 FF 才能恢复,但是重启 FF 后又需要再次添加临时组件(渣渣

    FF 插件的开发体验差到让我怀疑人生,不考虑适配了😂
    Zzdex
        10
    Zzdex  
       2019-01-30 23:51:09 +08:00 via iPhone
    不错
    newmind
        11
    newmind  
       2019-01-31 00:04:08 +08:00 via Android
    还不错,不过你说的这几个功能目前都有,暂时不想换了
    gzlock
        12
    gzlock  
    OP
       2019-01-31 00:35:59 +08:00
    APPEND 的内容有误:自定义类 Tabs 为 Chrome 的右键菜单工作
    正确内容是:自定义类 Menu 为 Chrome 的右键菜单工作

    @newmind #11 我脑子里基于浏览器的新点子(定义为没人做过的功能)为零😂
    wzw
        13
    wzw  
       2019-01-31 00:47:54 +08:00 via iPhone
    Hosts 切换的话,我就立刻用啦,很好的东西
    gzlock
        14
    gzlock  
    OP
       2019-01-31 02:09:31 +08:00
    @wzw #13
    @Tink #4

    容我想想怎么样整
    Mitt
        15
    Mitt  
       2019-01-31 04:01:11 +08:00 via iPhone   ❤️ 1
    @gzlock #14 先问清楚他们这个需求的场景才好下手
    akira
        16
    akira  
       2019-01-31 04:19:12 +08:00
    这个就是 小号 模式 吧
    gzlock
        17
    gzlock  
    OP
       2019-01-31 05:17:31 +08:00 via Android
    @akira 这个扩展的 cookies 功能,是基于我自身的需求:
    我用 chrome 的无痕模式作为主要的日常浏览网页用途,主要是为了避免定期清空浏览记录(地址栏的一大堆提示超级超级超级影响观感)和缓存(退出 chrome 或关闭 chrome 所有无痕窗口就会自动清空,节省硬盘空间)。重启 chrome 就像新的一样,挺好使的
    每天开电脑,打开 chrome 无痕模式,常用网站就要重新登录,这样的操作太麻烦
    我这样用 chrome 其实用了好几年了,每天都要重新登录网站。。。(截图其实可以看出我在使用无痕模式,地址栏右边是灰黑色的)
    近期实在不能忍了,需要可以保存 cookies 功能的扩展来简化操作,干脆做到极致:允许保存为多组 cookies 来实现切换 cookies 功能。
    因为 cookies 太敏感了,所以我想自己开发并且开源代码接受监督
    所以如果有人跟我一样使用 chrome 的无痕窗口作为主要的浏览用途的话,希望这个扩展可以帮助提高一些日常操作效率

    @Mitt 很有道理

    @wzw @Tink 欢迎去 GitHub 讨论切换 host 的细节和需求
    heiyutian
        18
    heiyutian  
       2019-01-31 05:47:14 +08:00 via Android   ❤️ 1
    自动换 ua 总算找到了
    yiying2020
        19
    yiying2020  
       2019-01-31 10:16:25 +08:00   ❤️ 1
    完美解决我的问题,点赞。
    gzlock
        20
    gzlock  
    OP
       2019-01-31 12:03:53 +08:00 via Android
    @heiyutian 针对域名来切换 ua 的需求,是从移动浏览器 UA 可以免登录看微博内容来的,pc ua 会跳转到微博首页,而我又没有注册微博帐号
    wzw
        21
    wzw  
       2019-07-29 08:59:28 +08:00
    @gzlock #20 hosts 有方案了吗
    gzlock
        22
    gzlock  
    OP
       2019-07-29 09:21:49 +08:00 via Android
    @wzw 现有版本算是间接支持类似 hosts 的功能吧,就是自定义规则的重定向,比 hosts 灵活性高一点,但是设置起来也复杂一点,我也有在 v2 发帖介绍了这个重定向功能,也做了一个配套的重定向语句测试工具
    hosts 只是简单的将某个域名重定向到某个 IP
    我这个扩展的重定向功能是可以提取原始 url 中的字符后传入到要重定向的 url,例如 a.com/abc 重定向为 b.com? path=abc
    当然也可以是无脑将 baidu.com 重定向到 google.com
    gzlock
        23
    gzlock  
    OP
       2019-07-29 09:22:51 +08:00 via Android
    @wzw https://www.v2ex.com/t/533001 重定向功能详细介绍,内有配套测试工具的网址
    chermy
        24
    chermy  
       2021-09-06 11:52:00 +08:00   ❤️ 1
    谢谢分享, 比 swap my cookie 好用
    iutopia
        25
    iutopia  
       2022-04-09 14:40:17 +08:00
    @newmind 能不能分享一下你是怎么实现这些功能?
    jianyisiqian
        26
    jianyisiqian  
       218 天前   ❤️ 1
    非常牛逼,
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2601 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 24ms · UTC 15:17 · PVG 23:17 · LAX 07:17 · JFK 10:17
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.