{var%20f='http://v.t.sina.com.cn/share/share.php?appkey=1515056452',u=z||d.location,p=['&url=',e(u),'&title=',e(t||d.title),'&source=',e(r),'&sourceUrl=',e(l),'&content=',c||'gb2312','&pic=',e(p||'')].join('');function%20a(){if(!window.open([f,p].join(''),'mb',['toolbar=0,status=0,resizable=1,width=440,height=430,left=',(s.width-440)/2,',top=',(s.height-430)/2].join('')))u.href=[f,p].join('');};if(/Firefox/.test(navigator.userAgent))setTimeout(a,0);else%20a();})(screen,document,encodeURIComponent,'','','https://www.manongdao.com/data/attach/logo/logo.png', '推荐 放荡不羁爱自由 的问题《Content Security Policy: cannot load Google API in》','https://www.manongdao.com/q-194433.html','页面编码gb2312|utf-8默认gb2312'));){kind=link}
This is relative an Chrome extension. I am trying a simple one which uses the Google Chart API
I have this code in my html document "popup.html", which is loaded on the click on the Icon.
<!doctype html>
<html>
<head>
<script type="text/javascript" src="js/libs/jquery-1.8.0.min.js"></script>
<script type="text/javascript" src="js/popup.js"></script>
<script type="text/javascript" src="http://www.google.com/jsapi?key=xxxxxxxxxxx"></script>
[...]
</body>
</html>
I get the following message:
Refused to load the script 'http://www.google.com/jsapi?key=xxxxxxxxxxx' because it violates the following Content Security Policy directive: "script-src 'self' chrome-extension-resource:".
I understood it is something relative to permissions, I tried to modify my Manifest file but without success:
{
[...]
"manifest_version": 2,
"permissions": ["http://*.google.com/"],
"content_security_policy": "script-src 'self' http://www.google.com; object-src 'self'",
}
Any idea?
Just make it use the
httpsprotocol instead. The error you're getting is regarding the Content Security Policy.See the
Relaxing the default policysection of the page. It mentions that you can only whitelistHTTPS,chrome-extension, andchrome-extension-resource.I wrestled with this issue for the past 12 hours and finally got it to work. Why did it take so long? Because I got thrown off the trail multiple times. First, the false leads:
"Make it HTTPS" -- Doesn't matter. My Chrome extension now makes regular HTTP calls to a different domain and works just fine. (UPDATE: A little more clarification. The "make it https" myth is rooted in a similar problem people tend to have when it comes to SCRIPT loading. If you need to bring in an outside .js file, then yes, you need to modify your content_security_policy and include the proper hostname, which seems to only accept https. Keep in mind this is different than hitting an external hostname for something like REST services. As I stated before, this does not require modification of the content_security_policy, nor https.)
"Use JSONP in your JQuery AJAX calls" -- This might be a way to address cross-domain AJAX in normal web pages, but isn't necessary in a chrome extension due to the built-in Content Security Policy. Further, implementing JSONP sounds like a PITA because it requires server-side changes to handle the callback parameter (or something, I'm still not sure). In any case, not necessary.
"Mess with the Content Security Policy (CSP) string in your extension" - Under manifest version 2, the default string works fine: "script-src 'self'; object-src 'self'". You don't even have to explicitly specify it. What you need is a to include the domain you're trying to hit from the extension as a "permission" value.
The solution:
Remove all inline javascript from your extension. Get it into a separate .js file. I suspect that for most html files with any decent amount of javascript, this process will suck. Luckily for me, all I had was a body onload which I was able to move into a separate js file as window.addlistener onload event instead.
The page you really need to read to get past this issue is here: https://developer.chrome.com/apps/contentSecurityPolicy