无法使用我的Chrome扩展程序执行HTTP请求

时间:2014-09-25 03:35:08

标签: javascript jquery json google-chrome google-chrome-extension

出于某种原因,当我尝试使用我的chrome扩展时,我一直收到以下错误; 拒绝加载脚本“http://dynamic.xkcd.com/api-0/jsonp/comic/1123?callback=random&_=1411616016083”,因为它违反了以下内容安全策略指令:“script-src'self'chrome-extension-resource:”。

这是我的代码:

的manifest.json

{
  "manifest_version": 2,

  "name": "XKCD New Tab",
  "description": "This extension demonstrates a browser action with kittens.",
  "version": "1.0",
  "permissions": [
    "tabs",
    "http://dynamic.xkcd.com/*"
  ],
   "chrome_url_overrides": {
    "newtab": "index.html"
  }

}

的index.html

<html>
<head>
<title>New Tab</title>
<script src="jquery-2.1.1.min.js"></script>
<script src="testcode.js"></script>

</head>
<style>

h1 {
    font-family: Helvetica; 
    color:#3498db;
    font-weight: 100;
}
.container {
    text-align: center;
    background-color: #ecf0f1;
}



}

</style>
<body bgcolor="#ecf0f1">
<div id="xkcdcontent" class="container"></div>
</body>
</html>

testcode.js

 var x = Math.floor((Math.random() * 1420) + 1);


$.ajax({
    url: "http://dynamic.xkcd.com/api-0/jsonp/comic/"+ x +"?callback=?",
    dataType: "json",
    jsonpCallback: "random",
    success: function(data) {
        $("#xkcdcontent").append(
            $("<h1 style=text-align:center;/>").text(data.title),
            $("<img align=middle/>").attr({
                src: data.img,
                title: data.alt,
                alt: data.title
            })
        );
    }   
});

1 个答案:

答案 0 :(得分:3)

您不应该使用扩展中的jsonp,因为它涉及执行服务器提供的代码,这就是错误的内容。您可以使用以下方式直接访问json:

url: "http://xkcd.com/"+ x +"/info.0.json",

请记住更新清单中的权限以允许此主机。并从参数中删除jsonpCallback字段。