chrome 扩展名更改 host/domain 警告

Question

我正在尝试创建一个 chrome 扩展，它会在我测试特定网站时通知我 host/domain 更改。通常会出现指向开发人员或实时环境的 links，如果我遵循这些 links 之一，我想得到警告，因为网站通常是相同的。

为清楚起见进行编辑：我希望它在 link 使我离开 http(s)://example.staging.something.com 并最终出现在实时站点 http(s) 上时提醒我： //www.example.com 或开发站点 http(s)://example.dev.something.com

到目前为止，我已经成功地创建了一个脚本来识别我何时处于暂存状态 url（我们的测试环境），但是我无法反转此逻辑以在我导航时向我发出警告到不包含 'staging'.

的 url

我的manifest.json

{
"manifest_version": 2,

"name": "A What URL",
"description": "This extension monitors and warns you of domain changes",
"version": "1.0",

"browser_action": {
"default_icon": "icon.png",
"default_popup": "popup.html"
},

"background": { "scripts": ["background.js"],
"persistent": false
},

"permissions": [
"activeTab",
"webNavigation"
]
}

我的background.js

   chrome.webNavigation.onCommitted.addListener(function(e) {
        alert ("you are still on staging!");
  }, {url: [{hostContains: 'staging'}]});

我敢肯定这很简单，但看来我的大脑要简单得多！

Answer 1

遗憾的是，您无法 "invert" 过滤器，因此您必须捕获所有事件并在代码中进行过滤。

Chrome 活动来了。您的代码建议您将它们视为 DOM 事件（使用 e 参数）。相反，他们根据所讨论的事件传递参数，有时是几个。

如果您查看 the documentation，您会发现预期的回调格式为：

function(object details) {...};

其中 details 将包含一个 url 属性.

所以你将拥有：

chrome.webNavigation.onCommitted.addListener(function(details) {
  // Regexp matches first "//", followed by any number of non-/, followed by "staging"
  if(!details.url.match(/[^\/]*\/\/[^\/]*staging/)) {
    alert ("This is no longer staging!");
  }
});

请注意，除非您可以将其关闭，否则这将非常烦人 - 毕竟它几乎可以匹配任何页面。

Answer 2

有多种方法可以解决您的问题。

使用chrome.webRequest.onBeforeSendHeaders (or .onSendHeaders) event to get notified when a request is sent to your production website, and check whether the Referer header is set to your staging site. This only works if the document referrer is set (this won't be the case if you're navigating from https to http, or if the "noreferrer" referrer policy设置。
在没有referer的情况下，使用webNavigation, webRequest and/or tabs APIs来跟踪页面的导航状态，当你检测到production -> dev的过渡发生时，为所欲为.正确实施这一点非常困难。

这是第一种方法的示例：

// background.js
chrome.webRequest.onBeforeSendHeaders.addListener(function(details) {
    var referer;
    for (var i = 0; i < details.requestHeaders.length; ++i) {
        var header = details.requestHeaders[i];
        if (header.name.toLowerCase() === 'referer' && header.value) {
            referer = header.value;
            break;
        }
    }
    if (referer && /^https?:\/\/dev\.example\.com(\/|$)/.test(referer)) {
        alert('Navigated from dev to production!');
    }
}, {
    urls: ['*://production.example.com/*', '*://prod.example.com/*'],
    types: ['main_frame', 'sub_frame'] // Track navigations, not img/css/etc.
}, ['requestHeaders']);

manifest.json的例子来测试前面的逻辑：

{
    "name": "Detect nav from dev to prod",
    "version": "1",
    "manifest_version": 2,
    "background": {
        "scripts": ["background.js"],
        "persistent": true
    },
    "permissions": [
        "webRequest",
        "*://*/*"
    ]
}

Answer 3

根据要求添加我的最终解决方案作为答案，以防其他人对未来感兴趣。

非常感谢 Xan 和 Rob 的帮助！如果我可以同时勾选两者，但最后我最终勾选了导致我实施的那个。

chrome.tabs.onUpdated.addListener(function(tabId, changeInfo, tab) {

    var queryInfo = {
    active: true,
    currentWindow: true
    };

   chrome.tabs.query(queryInfo, function(tabs) {
       var tab = tabs[0];
       var url = tab.url;

       if(!url.match(/[^\/]*\/\/[^\/]*staging/) &&   changeInfo.status=="complete"){
           alert ("WTF!!! " +url); 
       }
   });
});

chrome 扩展名更改 host/domain 警告

chrome extension changing host/domain warning

javascript

google-chrome

google-chrome-extension