有没有一种方法可以在chrome扩展(MV3)中允许不安全的内联代码？

Question

我目前正在制作chrome扩展（在Manifest版本3中），我正在尝试允许内联事件处理程序。在我的popup.html中，我想在单击按钮时运行一个函数，如下所示：

HTML：

<button onclick="foo(this)">bar</button>

（单独）JavaScript：

function foo(x){
    console.log(x);
}

当我运行扩展时,我得到以下错误：

拒绝执行内联事件处理程序，因为它违反了以下内容安全策略指令：“script-src'self'”。“unsafe-inline”关键字、哈希（“sha256-...'”）或nonce（“nonce-...'”）启用内联执行。

我尝试在JavaScript文件中添加一个内容安全策略和一个nonce（允许内联执行工作），但也没有成功：

"content_security_policy": {
    "extension_pages": "script-src 'self' 'nonce-baz'"
},

添加内容安全策略将导致以下错误：

'content_security_policy.extension_pages':指令'script-src'中的CSP值“'nonce-2726C7F26C'”不安全。无法加载清单。

所以我想知道如何允许执行内联代码。（我看过这篇文章：Chrome扩展-内容安全策略-执行内联代码，然而，答案是使用Manifest版本2，而我使用的是Manifest版本3。）

Answer 1

我不太了解如何制作chrome扩展，但如果您使用.addeVentListener可能会有所帮助。我听说不推荐使用onclick，所以您可能希望使用和.addeVentListener。

在你的情况下，我认为应该是这样的：

HTML：

<button id='putIdHere'>bar</button>

JS：

document.getElementById('putIdHere').addEventListener('click', {
   console.log('stuff')
});

不确定这是否有帮助，但希望您能用它做点什么：）。