Chrome extension Cross Domain Request

问题:

I know that this has been talked about many times here, and I have read most of these threads but I can't seem to get my script working.

Problem is that I am trying to use bitly api to shorten urls in google chrome extension. I am saving users login and apiKey in localstorage and before I do so I validate them.

The code to do so is:

$.ajax({
        url:"http://api.bit.ly/v3/validate",
        dataType:'jsonp',
        data:{
            login: login,
            apiKey: apiKey,
            x_login :"test",
            x_apiKey :"test"
        },
        success:function (jo, textStatus, jqXHR) {
            if (jo.status_code == 200) {
                setItem('dg_BitlyApiKey', apiKey);
                setItem('dg_BitlyLogin', login);
                alert('Saved');
            } else {
                alert('Incorrect login and/or apiKey!')
            }
        }
    });

I do have my permissions set to "permissions": ["tabs", "notifications", "http://*/*", "https://*/*"] but I still keep getting:

Refused to load script from 'http://api.bit.ly/v3/validate?callback=jQuery17204477599645033479_1334062200771&login=&apiKey=&x_login=test&x_apiKey=test&_=1334062201506' because of Content-Security-Policy.

The script itself works outside the extension so I assume the problem isn't within the script but with the permissions.

What am I doing wrong here?

回答1:

The problem is that you aren't really doing a XHR request, you're doing a JSONP request on an insecure HTTP resource. See the question How to load an external JavaScript inside an extension popup and the related Chromium bug report.

Yeah, we're no longer allowing insecure scripts in extensions. If you load a script over HTTP, an active network attacker can inject script into your extension, which is a security vulnerability.

JSONP operates by dynamically adding a new script tag into your page and then executing the contents. In your case, the script resource is fetched over HTTP (instead of HTTPS). If your extension uses version 2 of the extension manifest, its background pages cannot fetch non-HTTPS scripts.

Solution: If you use the Bitly API over HTTPS, I believe that will fix your issue. Send your Ajax call to https://api-ssl.bitly.com/v3/validate (instead of your current value of http://api.bit.ly/v3/validate)

回答2:

You need to package your app/extension for cross domain requests to work. A hosted application will not be able to do cross domain requests. See:

Cross-Origin XMLHttpRequest in chrome extensions