通过扩展将 JS 文件 url 注入 head 标记时出现 CSP 问题

CSP issue while injecting a JS file url to the head tag by extension

提问人:Sounak Das 提问时间:9/11/2023 更新时间:9/11/2023 访问量:30

问:

所以,我正在尝试构建一个扩展,我将向 head 标签注入一个 js 文件,

我遇到了CSP问题。

清单.js

  "name": "test",
  "version": "0.0.1",
  "manifest_version": 3,
  "action": {
    "default_icon": {
      "16": "icons/*****-16.png",
      "32": "icons/*****-32.png",
      "48": "icons/*****-48.png",
      "128": "icons/*****-128.png"
    },
    "default_popup": "popup.html"
  },
  "permissions": ["storage", "activeTab", "scripting", "tabs"],
  "content_scripts": [
    {
      "id": "uniqueScriptId",
      "world": "MAIN",
      "all_frames": true,
      "matches": ["<all_urls>"],
      "js": ["popup.js"],
      "run_at": "document_end"
    }
  ],
  "content_security_policy":
     "script-src 'self' 'unsafe-eval' https://<bucket-name>.s3.<location>-1.amazonaws.com/test.js"
}

从单击按钮的弹出窗口中,该代码应注入 popup.html

some code....
.....
.....
<div>
       <form id="submit_form">
            <div class="input-div">
              <input
                type="text"
                id="test_input"
                placeholder="Enter your key here"
                class="key-input"
              />
            </div>
            <div class="button-div">
              <button type="submit" class="submit-button" id="submitButton">Lets Go</button>
            </div>
        </form>
      </div>
   some code.........

在 popup.js 中

 form.addEventListener("submit", function (event) {
   document.addEventListener("DOMContentLoaded", function () {
   const scriptElement = document.createElement("script");
   scriptElement.setAttribute("type", "text/javascript");
   scriptElement.src =  "https://<bucket-name>.s3.<location>.amazonaws.com/test.js"
   document.head.appendChild(scriptElement);
  }
}


出现错误

拒绝执行内联脚本,因为它违反了以下内容安全策略指令:“script-src-elem 'self' 'unsafe-eval' https://.s3..amazonaws.com/test.js”。启用内联执行需要“unsafe-inline”关键字、哈希 ('sha256-3CSG941/zmVkjasYsyW4mq+69/ucZwLKF+F0ad4mxzo=') 或随机数 ('nonce-...')。

问题是什么以及如何解决它,因为 JS 代码注入了 THA 头部,它应该可以正常工作。

javascript google-chrome-extension 扩展方法

评论

0赞 wOxxOm 9/11/2023
ManifestV3 在设计上不允许使用外部脚本。

答: 暂无答案