エラーがあります:
次のコンテンツセキュリティポリシーディレクティブに違反しているため、インラインスクリプトの実行を拒否しました:
"script-src 'self' chrome-extension-resource:"
。インライン実行を有効にするには、'unsafe-inline'
キーワード、ハッシュ('sha256-...'
)、またはノンス('nonce-...'
)のいずれかが必要です。chrome-extension://ldbpohccneabbobcklhiakmbhoblcpof/popup.html:1
'unsafe-eval'
はコンテンツセキュリティポリシーディレクティブ"script-src 'self' chrome-extension-resource:"
で許可されているスクリプトのソースではないため、文字列をJavaScriptとして評価することを拒否しました。
コードpopup.js
$(document).ready(function() {
$.getJSON('http://.......alerts.json', function(data) {
alert('HELLO');
});
});
マニフェスト:
{
"manifest_version": 2,
"name": "Alert",
"description": "This extension for .",
"version": "2.0",
"content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'",
"permissions": [
"http://www.......il/"
],
"browser_action": {
"default_icon": "icon.png",
"default_popup": "popup.html"
},
"content_scripts": [ {
"js": [ "jquery.min.js", "popup.js" ],
"matches": [ "http://*/*", "https://*/*"]
}]
}
現れる:
<!doctype html>
<html>
<head>
<title>Getting Started Extension's Popup</title>
<style>
body {
min-width: 357px;
overflow-x: hidden;
}
img {
margin: 5px;
border: 2px solid black;
vertical-align: middle;
width: 75px;
height: 75px;
}
</style>
<head>
<script src='jquery.min.js'></script>
<script src='popup.js'></script>
</head>
</head>
<body>
</body>
</html>
Chromeはインラインスクリプトとインラインイベントハンドラー(onClickなど)を許可しなくなったため、これらのメッセージがありました。外部JSファイル(popup.js)およびaddEventListener( )は、イベントをDOMオブジェクトに関連付けるために使用する必要があります。
例えば:
<body onload="initialize()">
<button onclick="handleClick()" id="button1">
次のものに置き換える必要があります。
window.addEventListener("load", initialize);
document.getElementById("button1").addEventListener("click",handleClick);
あなたの場合、HTMLにJSは表示されませんが、いくつか試すことができるものがあります。
Chrome拡張マニフェストV2のメモ を参照してください
私は非常に似た問題を抱えていました。インラインスクリプトもインラインイベントハンドラも使用していませんが、それでもエラーが発生します。結局のところ、jQueryは、Chrome Extensionsで許可されていないこのような要求の応答を内部的に評価しようとします。私の場合、$.ajax()
を_dataType: 'json'
_ 。dataType
をtext
に変更し、JSON.parse()
を使用して手動でJSONを解析することで問題を解決しました。
また、jQuery APIのほとんどは、Chrome Extension。で使用される場合に同様のエラーを引き起こす解析中に、特定のhtml文字列に含まれるスクリプトを実行しようとすることに言及することも重要です。 jQuery parseHTML()
のドキュメントからの引用は次のとおりです。
HTML文字列を受け入れるほとんどのjQuery APIは、HTMLに含まれるスクリプトを実行します。 keepQuerysが明示的にtrueでない限り、jQuery.parseHTMLは解析されたHTMLでスクリプトを実行しません。ただし、ほとんどの環境では、たとえば属性を介してスクリプトを間接的に実行することも可能です。呼び出し元はこれを認識し、URLやCookieなどのソースからの信頼できない入力をクリーンアップまたはエスケープすることで、これを防ぐ必要があります。将来の互換性のために、keepScriptsが指定されていないかfalseの場合、呼び出し元はスクリプトコンテンツを実行する機能に依存しないでください。
Chromeのインラインスクリプト評価に関する制限のため、これらのポイントをChrome拡張機能で使用すると問題が発生することに注意してください。一般的に当てはまらない場合があります。
私もこの問題に直面しました。
index.html
のhead-tag
に次のコードを入れていました
<script>
var global = global || window;
var Buffer = Buffer || [];
var process = process || {
env: { DEBUG: undefined },
version: []
}
</script>
次に、これをファイル(つまり、script.js
)に移動し、index.html
のように参照します
<script src="./script.js"></script>
それでもそのエラーが発生し、最終的に./
を削除し、問題を解決しました
<script src="script.js"></script>