时间戳

首页 > 解决方案 > Tampermonkey 脚本被 CSP 错误阻止

javascript - Tampermonkey 脚本被 CSP 错误阻止

问题描述

我是 javascript 和 Tampermonkey 的新手。我想在 Memrise 的网站上添加一个框架。代码如下：

// ==UserScript==
// @name         Merise
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  try to take over the world!
// @author       k1
// @match        https://app.memrise.com/aprender/*
// @icon         https://www.google.com/s2/favicons?domain=memrise.com
// @grant        none
// ==/UserScript==

(function() {
    'use strict';
    var word = document.getElementsByClassName("sc-1nck79x-5 jPETsr")[0]
    var bdy = document.getElementsByClassName("sc-r1ec2z-1 evBYsl")[0]
    var defl = "https://learnersdictionary.com/definition/" + word.innerHTML
    var fr = document.createElement("IFRAME");
    fr.height = "500px"
    fr.src = defl
    fr.style.maxWidth="90%"
    bdy.appendChild(fr);
})();

但是代码执行由于错误而被阻止：内容安全策略：页面的设置阻止了内联资源的加载（“script-src”）。

如果有任何方法可以解决这个问题，请告诉我如何解决这个问题。谢谢。

标签： javascriptcontent-security-policytampermonkey

解决方案

使用GM_addElement来规避此类 CSP 限制：

// ==UserScript==
// @name         Merise
// @match        https://app.memrise.com/aprender/*
// @grant        GM_addElement
// ==/UserScript==

var word = document.getElementsByClassName('sc-1nck79x-5 jPETsr')[0].textContent;
var bdy = document.getElementsByClassName('sc-r1ec2z-1 evBYsl')[0];
GM_addElement(bdy, 'iframe', {
  src: 'https://learnersdictionary.com/definition/' + encodeURIComponent(word),
  style: 'width: 90%; height: 500px;',
});

推荐阅读