使用 decarativeNetRequest 修改用户代理并使用 chrome 扩展刷新页面答案

【问题标题】：modify user-agent with decarativeNetRequest and refresh page with chrome extension使用 decarativeNetRequest 修改用户代理并使用 chrome 扩展刷新页面
【发布时间】：2023-02-20 17:51:25
【问题描述】：

我正在尝试将切换迁移到清单 V3，这会在 web 和 mobile 视图之间切换。使用新的 declarativeNetRequest 可以修改标题，但不会重新加载页面。理想情况下，在应用新的移动用户代理后，它应该在移动视图中重新加载和加载页面。

我在declarativeNetRequest 中声明了如下动态规则：

const rules  = {
        addRules: [
          {
            id: 36,
            priority: 2,
            action: {
              type: 'modifyHeaders' as chrome.declarativeNetRequest.RuleActionType,
              requestHeaders: [
                {
                  header: 'user-agent',
                  operation: 'set' as chrome.declarativeNetRequest.HeaderOperation,
                  value: `mobileUserAgent`,
                },
              ],
            },
            condition: {
            urlFilter: 'example.com',
              resourceTypes: [
                'main_frame' as chrome.declarativeNetRequest.ResourceType,
                'xmlhttprequest' as chrome.declarativeNetRequest.ResourceType,
                ],
            },
          },
        ],
      }

     chrome.declarativeNetRequest.updateDynamicRules(rules, () => {
        if (chrome.runtime.lastError) {
          console.error(chrome.runtime.lastError)
        } else {
          chrome.declarativeNetRequest.getDynamicRules(rules => console.log(rules))
        }
      })

它在 chrome 开发工具中检查时确实更新了值，但它不会刷新页面并且不会使用新的用户代理加载移动视图。

仅供参考，这是执行此操作的旧方法并且工作正常，但它不支持清单 V3 这是修改标头的旧方法。

chrome.webRequest.onBeforeSendHeaders.addListener(
  function (details) {
    for (var i = 0; i < details.requestHeaders.length; ++i) {
      if (details.requestHeaders[i].name === 'User-Agent') {
        details.requestHeaders[i].value = details.requestHeaders[i].value + ' OurUAToken/1.0';
        break;
      }
    }
    return { requestHeaders: details.requestHeaders };
  },
  { urls: ['<all_urls>'] },
  ['blocking', 'requestHeaders']
);

清单 V3 中的 chrome.webRequest.onBeforeSendHeaders.addListener 是什么？

【问题讨论】：

这两种方法都不会重新加载页面，它们都会修改传出请求。不同之处在于第一段代码设置了有限的资源类型。尝试删除它。此外，devtools 在显示 DNR 标头方面存在错误，因此最好在 Fiddler、Charles、WireShark 等外部工具中进行验证。

标签： google-chrome google-chrome-extension chrome-extension-manifest-v3 chrome-declarativenetrequest

【解决方案1】：

运行您的代码后，选项卡将使用您的移动用户代理。运行此代码之前的选项卡需要用另一个代码重新加载。这是一个例子：

    chrome.windows.getCurrent({populate:true},function(window){ 
    for(var tab of window.tabs){
        for(var site of ["example.com"]){
            if(tab.url && tab.url.indexOf(site) >= 0)chrome.tabs.reload(tab.id);
        }
    }
});

【讨论】：