javascript - 防止中键点击打开链接

Question

我想阻止中键点击打开链接，但只是可选的 - 在 chrome 扩展程序的设置中可以将其设置为阻止或不阻止。

当有人在 chrome 扩展设置中更改该选项(阻止或不阻止)时，它必须立即影响网站，而无需重新加载当前页面 (ctrl+r)。为此，我将“chrome.runtime.sendMessage.....”放入“$(document).on(“click....”以检查 EnablePrevent 的值(真或假)(来自本地存储) ”。因此它会检查每次点击的值(并且我不需要重新加载页面 ctrl+r 来检查该值)。

这是我的代码。我不知道如何从 block “chrome.runtime.sendMessage.....”获取值(true)，并且我无法将 block “if (e.button === 1...”放入“chrome”中.runtime.sendMessage.....”因为阻止不起作用...(它需要“$(document).on(“click....”)

$(document).on("click", function(e) {
    chrome.runtime.sendMessage({method: "getLocalStorage", key: "EnablePrevent"}, function(response) {
        if (response.data == "true") {
            // ...
        }       
    });
    if (e.button === 1 && e.target.closest("a")) 
        e.preventDefault(); // not optional, always works..
    }
});

对于 Firefox 的附加组件来说这不是问题:

var test = {
    MiddleClickListener : function(e) {
        if(e.button === 1) {
            var prefManager = Components.classes["@mozilla.org/preferences-service;1"].getService(Components.interfaces.nsIPrefBranch);
            var EnablePrevent = prefManager.getBoolPref("extensions.EnablePrevent");

            if (e.target.closest("a") && EnablePrevent) {
                e.preventDefault();
            }
        }
    }
}
window.addEventListener("click",test.MiddleClickListener,false);

Answer 1

在点击事件中等待messageResponse是错误的逻辑
您应该在内容脚本中准备好决定 为此，请使用 Chrome storage API

list

   "permissions": ["storage",.....]

选项页面

    //on user changing option
    var EnablePrevent= ....//true or false 

    chrome.storage.local.set({'disableMMC': EnablePrevent});

    //to update it in real time, reroute it through background page
    chrome.runtime.sendMessage({'user': 'choice', 'value': EnablePrevent});

背景页

chrome.extension.onMessage.addListener(function (message) {
    if (message.user=== 'choice') {
        var passValue = message.value;
        //send new value to all tabs
        chrome.tabs.query({}, function(tabs) {
            for (var i=0; i<tabs.length; i++) {
                chrome.tabs.sendMessage(tabs[i].id, {'newValue': 'fromBG', 'newV':passValue});
            }
        });
    }
});

内容脚本

var disableMiddleButton;
chrome.storage.local.get('disableMMC', function(result) {
    disableMiddleButton = result.disableMMC;
});

//to update it in real time, listen for MSG from BG
chrome.extension.onMessage.addListener(function (message) {
    if (message.newValue=== 'fromBG') disableMiddleButton = message.newV;
});

//use disableMiddleButton variable in your click logic

$(document).on("click", function(e) {
    if (disableMiddleButton  && e.button === 1 && e.target.closest("a")) 
        e.preventDefault();
});

<小时/>

另一个解决方案是监听内容脚本中的存储变化。在这种情况下，您不需要从“选项”页面发送任何消息(或通过后台页面使用重新路由并在内容脚本中使用 onMessage 监听器)

内容脚本

var disableMiddleButton;
chrome.storage.local.get('disableMMC', function(result) {
    disableMiddleButton = result.disableMMC;
});

//to update it in real time, listen for change in storage
chrome.storage.onChanged.addListener(function(changes, namespace) {
    if ('disableMMC' in changes) disableMiddleButton  = changes.disableMMC.newValue;
});

//use disableMiddleButton variable in your click logic

$(document).on("click", function(e) {
    if (disableMiddleButton  && e.button === 1 && e.target.closest("a")) 
        e.preventDefault();
});