如何在Chrome扩展程序中调用原始页面(标签)中的功能

Pen*_*gin 23 google-chrome-extension

我现在正在制作Chrome扩展程序.我想从Chrome扩展中调用原始页面(选项卡)中定义的JS函数.是否background.html或Content_Script称呼它们并不重要.

例如:

原始页面(标签)

<html>
<head>
<title>Original Page</title>
<script>
function greeting(){
    alert("Ohayou!");
    // some other codes here
}
</script>
</head>
<body></body>
</html>
Run Code Online (Sandbox Code Playgroud)

然后我想在Google扩展程序中调用原始页面中的"问候语"功能.我怎么能做到这一点?

che*_*_ca 30

您也可以简单地在内容脚本中写入:

location.href="javascript:greeting(); void 0";
Run Code Online (Sandbox Code Playgroud)

  • 拒绝执行 JavaScript URL,因为它违反了以下内容安全策略指令:“script-src 'self' 'unsafe-eval'”。启用内联执行需要“unsafe-inline”关键字、散列(“sha256-...”)或随机数(“nonce-...”)。 (4认同)
  • 简单,直接,无代码注入开销!好的 (2认同)

Dan*_*Lee 14

对于第一部分,您可以使用这个很好的答案:使用内容脚本将代码插入页面上下文.

在内容脚本中调用函数很容易.您可以创建自己的事件,然后可以在内容脚本中监听.这将是这样的:

注入代码:

var evt = document.createEvent('Event');
evt.initEvent('myCustomEvent', true, false);

// fire the event
document.dispatchEvent(evt);
Run Code Online (Sandbox Code Playgroud)

内容脚本:

document.addEventListener('myCustomEvent', function() {
  // do whatever is necessary
});
Run Code Online (Sandbox Code Playgroud)