在Chrome扩展中传递的基本消息似乎失败 [英] Basic message passing in chrome extension seems to fail

查看:150
本文介绍了在Chrome扩展中传递的基本消息似乎失败的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我已阅读文档,这应该是基本的,但我似乎无法让这些警报出现。有什么不对?



popup.html

 < html> 
< head>
< script>
function finder(){
chrome.tabs.getSelected(null,function(tab){
chrome.tabs.sendMessage(tab.id,{type:feature},function(响应){
console.log(response.farewell);
});
});
}
< / script>
< style>
p {
border:1px纯黑色;
width:200px;
font-size:10px;
}
< / style>
< / head>
< body>
< p>< a id =jira>点击以填充FE描述< / a>< / p>
< script>
var jira = document.getElementById('jira');
jira.addEventListener('click',finder,false);
< / script>
< / body>
< / html>

内容脚本:

  chrome.extension.onMessage.addListener(function(request,sender,sendResponse){
alert('sreceived');
if(request.type ==feature){
alert('score!');
}
});


解决方案

嵌入式JavaScript不会被执行。此限制禁止内联块和内联事件处理程序(例如< button onclick =...> )。



通过以上几行,很明显popup.html违反了限制,可以按照以下方式解决:

删除所有<$ c $在 popup.html 中标记c>< script> 标签并将原始代码移动到 popup.js

 < html> 
< head>
< script src =popup.js>< / script> <! - 添加了这一行 - >
< style>
p {
border:1px纯黑色;
width:200px;
font-size:10px;
}
< / style>
< / head>
< body>
< p>< a id =jira>点击以填充FE描述< / a>< / p>
< / body>
< / html>

我没有将字符串复制粘贴到 popup.js 。这些是我所做的更改:


  1. chrome.tabs.getSelected() 已弃用 chrome.tabs.query() ,因此我更新了 chrome.tabs.getSelected(null,function(tab){});

  2. 注释 console.log(response.farewell); ,因为内容脚本中没有响应处理程序。

final popup.js

  function finder(){
chrome.tabs.query({
status:complete,
currentWindow:true,
active:true
},function(tabs) {
chrome.tabs.sendMessage(tabs [0] .id,{
type:feature
},function(response){
//console.log(response.farewell);
});
});
}
document.addEventListener('DOMContentLoaded',= function(){
document.getElementById('jira')。onclick = finder;
});

注意manifest.json p>


  1. 确保权限可用为permissions:[tabs,< all_urls>] code>

  2. 内容脚本的权限也

     content_scripts :[
    {
    matches:[< all_urls>],
    js:[content.js]
    }
    ]


最终manifest.json

$ name $b $ b $ name基本消息传递
description:这演示了基本消息传递,
browser_action:{
default_popup:popup.html,
default_icon:screen.png
},
manifest_version:2,
version:2,
permissions:[tabs,< all_urls>],
content_scripts: [
{
matches:[< all_urls>],
js:[content.js]
}
]
}

您的内容脚本没问题,所以我没有更改它。



示范



输出:







让我知道您是否需要更多信息。


I have read the documentation and this should be basic but I can't seem to get those alerts to appear. What's wrong?

popup.html

<html>
<head>
<script>
    function finder() {
        chrome.tabs.getSelected(null, function(tab) {
          chrome.tabs.sendMessage(tab.id, {type: "feature"}, function(response) {
            console.log(response.farewell);
          });
        });
    }
</script>
<style>
    p {
        border: 1px solid black;
        width:200px;
        font-size:10px;
    }
</style>
</head>
<body>
<p><a id="jira">Click to populate FE description</a></p>
<script>
var jira = document.getElementById('jira');
jira.addEventListener('click', finder, false);
</script>
</body>
</html>

Content Script:

chrome.extension.onMessage.addListener(function(request, sender, sendResponse) {
    alert('sreceived');
    if (request.type == "feature") {
        alert('score!');
    }
});

解决方案

Inline JavaScript will not be executed. This restriction bans both inline blocks and inline event handlers (e.g. <button onclick="...">).

By above lines it is clear that your popup.html violates restrictions, which can be solved as follows:

Remove all <script> tags in popup.html and move the original code to popup.js.

<html>
<head>
<script src="popup.js"></script> <!-- Added this line -->
<style>
    p {
        border: 1px solid black;
        width:200px;
        font-size:10px;
    }
</style>
</head>
<body>
<p><a id="jira">Click to populate FE description</a></p>
</body>
</html>

I did not literally copy-paste the code in popup.js. These are the changes I made:

  1. chrome.tabs.getSelected() is deprecated in favour of chrome.tabs.query(), so I updated chrome.tabs.getSelected(null, function(tab) {});
  2. Commented out console.log(response.farewell); because there is no response handler from content script.

Final popup.js

function finder() {
    chrome.tabs.query({
        "status": "complete",
        "currentWindow": true,
        "active": true
    }, function (tabs) {
        chrome.tabs.sendMessage(tabs[0].id, {
            type: "feature"
        }, function (response) {
            //console.log(response.farewell);
        });
    });
}
document.addEventListener('DOMContentLoaded',= function() {
    document.getElementById('jira').onclick = finder;
});

Cautions for manifest.json

  1. Ensured permissions are available as "permissions":["tabs","<all_urls>"],
  2. Permissions for content script also

    "content_scripts": [
        {
          "matches": ["<all_urls>"],
          "js": ["content.js"]
        }
    ]
    

Final manifest.json

{
"name":"Basic Message Passing",
"description":"This demonstrates Basic Message Passing",
"browser_action":{
    "default_popup":"popup.html",
    "default_icon":"screen.png"
},
"manifest_version":2,
"version":"2",
"permissions":["tabs","<all_urls>"],
"content_scripts": [
    {
      "matches": ["<all_urls>"],
      "js": ["content.js"]
    }
  ]
}

Your content script was fine, so I did not change it.

Demonstration

Output:

Let me know if you need more information..

这篇关于在Chrome扩展中传递的基本消息似乎失败的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆