Я написал javascript с использованием React в html-файле. Я могу с успехом извиниться в своем локальном веб-браузере, но когда я загружаю его на расширение Chrome, он сообщает об ошибке, как это:
Отказался выполнить встроенный скрипт, потому чтоон нарушает следующую директиву политики безопасности содержимого: "script-src 'self' https://cdnjs.cloudflare.com 'unsafe-eval'".Либо ключевое слово unsafe-inline, хэш ('sha256-lTIMNTuZotM + E9A4AGJeqMEUWkdv1blKxgUpdRd8jwk ='), либо nonce ('nonce -...') требуется для включения встроенного выполнения.
добавить ключевое слово «unsafe-inline» в файл manifest.json, но ошибка все равно та же.
мой файл manifest.json выглядит так:
{
"manifest_version": 2,
"name": "Price Tracker",
"description": "This extension will track the price of a page",
"version": "1.0",
"browser_action": {
"default_icon": "icon.png",
"default_popup": "index.html"
},
"permissions": [
"tabs",
"activeTab",
"identity",
"identity.email",
"http://34.204.12.200:5000/"
],
"background": {
"page": "index.html"
},
"content_security_policy": "script-src 'self' 'unsafe-inline' https://ajax.googleapis.com http://cdnjs.cloudflare.com; object-src 'self'",
"content_scripts": [
{
"matches": ["http://cdnjs.cloudflare.com/*"],
}
],
"options_page": "copy.html"
}
Мой файл copy.html:
<!DOCTYPE html>
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.4.2/react-dom.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-standalone/6.21.1/babel.min.js"></script>
<script type="text/babel">
class Display extends React.Component {
constructor(props){
super(props);
this.state={
urls: []
}
}
componentDidMount(){
console.log("test");
var xhr = new XMLHttpRequest();
var self = this; //why?
xhr.open("POST", "http://34.204.12.200:5000/get_all_tracked", true);
console.log("test1");
// if (xhr.readyState != 4) {
// console.log("test2");
// return;
// }
xhr.onreadystatechange = function(e){
console.log("test5");
if(xhr.readyState===4 && xhr.status===200){
console.log("test3");
self.setState(
{
urls: JSON.parse(this.response)
});
}
}
// console.log("test3");
// self.setState(
// {
// urls: JSON.parse(this.response)
// });
console.log("test4");
// xhr.open("POST", "http://34.204.12.200:5000/get_all_tracked", true);
var params = {'email': "tongxiong99@gmail.com"};
xhr.send(JSON.stringify(params));
}
render() {
if (this.state.urls === undefined || this.state.urls.length == 0) {
return (<div>You are not tracking any pages.</div>);
}
return;
}
}
ReactDOM.render(
<Display />,
document.getElementById('root')
);
</script>
</head>
<body>
<div id="root"></div>
</body>
</html>
Может кто-нибудь объяснить, что мне следует делать?Спасибо!