Safari 扩展 - 消息答案

【问题标题】：Safari Extension - MessageSafari 扩展 - 消息
【发布时间】：2019-03-24 19:29:14
【问题描述】：

这是我的第一个 Safari 扩展程序，到目前为止，我喜欢它安静一点。我正在尝试添加一个扩展栏，它与注入的.js 页面交互并通过 jquery .toggle() 切换页面上的项目；

我已经能够将 jQuery 加载到页面中没有问题，但是在从扩展栏向 inject.js 发送消息时我做不到。我今天花了 8 个多小时查看 Apple 上的开发者页面。我唯一能做的就是

扩展栏：

<!DOCTYPE html>
<html>
<head>
    <title>Board Tools</title> <!-- Extension Bar -->
    <script type="text/javascript" src="jQuery.min.js"></script>
    <script type="text/javascript">
        const myGlobal = safari.extension.globalPage.contentWindow;

    function ToggleBoard(){ 
        myGlobal.test();    
    }
</script>

</head>
<body>

    <input type="button" id="board" value="Board Toggle" onClick="ToggleBoard();">

</body>
</html>

全局 HTML：

<!DOCTYPE HTML>
<html>
<head>
    <title>global page</title>
    <script type="text/javascript">

        function test() {
            alert("1");
            event.target.page.dispatchMessage("test", "test");
            alert("2");
    }

   </script>
</head>
<body> </body>
</html>

Injected.js：

function test(msgEvent) {
    alert(msgEvent.name);
}
// register for message events
safari.self.addEventListener("message", test, false);

我可以从扩展栏调用 ToggleBoard() 函数。 ToggleBoard() 函数可以从全局 HTML 调用 test() 函数。当在全局 HTML 页面上调用 test() 函数时，第一个警报会触发，而第二个则不会。我至少已经把它缩小到那么远了。我知道我试图发送信息的方式可能是错误的，但这就是这里所说的：https://developer.apple.com/library/archive/documentation/Tools/Conceptual/SafariExtensionGuide/MessagesandProxies/MessagesandProxies.html#//apple_ref/doc/uid/TP40009977-CH14-SW1

只是为了看看这是我的错误还是开发页面上的一些愚蠢的东西，我在他们的页面上复制了确切的代码，只使用了 Global HTML 和 Injected.js，但我仍然没有得到我正在寻找的结果为。

已解决：我选择的答案确实适用于我遇到的问题。这不是每个人的确切答案，但确实如此，与 cmets 一起帮助我理顺我的代码。为了让各种扩展组件正确发送消息，我需要将扩展远程访问设置为全部，然后将 URL 模式添加到白名单。我的扩展只在我想要的页面上触发，我可以使用消息。

【问题讨论】：

标签： javascript safari safari-extension

【解决方案1】：

在全局页面的test 函数中，event 没有引用任何内容，因为该函数不是事件处理程序。如果您想定位活动标签，请改用它：

safari.application.activeBrowserWindow.activeTab.page.dispatchMessage('test, 'test');

如果稍后您发现希望扩展栏或全局页面响应来自注入脚本的消息，您可以在任一位置添加类似这样的内容：

safari.application.addEventListener('message', function (e) {
    if (e.name === 'whatever') {
        e.target.page.dispatchMessage('foo', 'bar');
    }
}, false);

如果您想从注入脚本向全局页面或扩展栏发送消息，请使用safari.self.tab.dispatchMessage 并在全局页面或扩展栏中设置“消息”事件处理程序。

【讨论】：

这让我朝着正确的方向前进。最终我真正想要的是响应扩展栏的注入脚本。
或者通过切换页面上的 div 让全局 HTML 响应扩展栏。
所以我做了一些尝试，如果我将 Extension Website Access 设置为 All 而不是 Some，我可以使用此页面上的示例：developer.apple.com/library/safari/#documentation/Tools/… 但是当我将其设置为 some 并选择我的域模式消息失败。
使用safari.self.tab.dispatchMessage将注入脚本的消息发送到扩展栏。
我想从扩展栏 -> 注入脚本。基本上我在注入的脚本中有一个函数，我希望在单击扩展栏上的按钮时触发该函数。