I am writing codes for a Chrome extension that needs to access minus, which uses oAuth 2.0 for authentication, so I wrote a javascript file 'test.js', then included it in a HTML file 'test.html', then load 'test.html' in Chrome to test the javascript codes, which is used for the authentication.

The structure of the 'test.js' looks like this:

function Ajax(url, options) {

// some function content

    // Sending data
    if (options.method === "POST" && (options.params || options.binaryData)) {
        if (options.binaryData) {
            xhr.sendAsBinary(options.binaryData);
        } else {
            xhr.send(hashToQueryString(options.params));
        }
    } else {
        xhr.send(null);
    }

    return xhr;
}

function refreshToken(refresh_token) {
    var params = {
        'grant_type': 'refresh_token',
        'client_id': API_KEY,
        'client_secret': API_SECRET,
        'refresh_token': refresh_token,
        'scope': 'read_all modify_all upload_new'
    }

    new Ajax("", {
        params: params,

        onSuccess: function(response) {
            console.log(response.access_token);
        },

        onError: function(response) {
            console.log('error: wrong_token');
        }
    });               
}

refreshToken();

When I loaded the 'test.html' in Chrome to test 'test.js', it prompted an error in the console, saying "XMLHttpRequest cannot load ?... Origin file:// is not allowed by Access-Control-Allow-Origin." I have tried to launch Chrome with the option "--allow-file-access-from-files" or "--disable-web-security", but it didn't solve the problem. However, if I mented the "Sending data" part in the "Ajax"function, there is no error.

Does anyone have ideas what's going on here?

Thanks!

I am writing codes for a Chrome extension that needs to access minus., which uses oAuth 2.0 for authentication, so I wrote a javascript file 'test.js', then included it in a HTML file 'test.html', then load 'test.html' in Chrome to test the javascript codes, which is used for the authentication.

The structure of the 'test.js' looks like this:

function Ajax(url, options) {

// some function content

    // Sending data
    if (options.method === "POST" && (options.params || options.binaryData)) {
        if (options.binaryData) {
            xhr.sendAsBinary(options.binaryData);
        } else {
            xhr.send(hashToQueryString(options.params));
        }
    } else {
        xhr.send(null);
    }

    return xhr;
}

function refreshToken(refresh_token) {
    var params = {
        'grant_type': 'refresh_token',
        'client_id': API_KEY,
        'client_secret': API_SECRET,
        'refresh_token': refresh_token,
        'scope': 'read_all modify_all upload_new'
    }

    new Ajax("https://minus./oauth/token", {
        params: params,

        onSuccess: function(response) {
            console.log(response.access_token);
        },

        onError: function(response) {
            console.log('error: wrong_token');
        }
    });               
}

refreshToken();

When I loaded the 'test.html' in Chrome to test 'test.js', it prompted an error in the console, saying "XMLHttpRequest cannot load https://minus./oauth/token?... Origin file:// is not allowed by Access-Control-Allow-Origin." I have tried to launch Chrome with the option "--allow-file-access-from-files" or "--disable-web-security", but it didn't solve the problem. However, if I mented the "Sending data" part in the "Ajax"function, there is no error.

Does anyone have ideas what's going on here?

Thanks!

• javascript
• ajax
• google-chrome-extension
• xmlhttprequest

• 1 I believe you are calling your requests cross-domain. Google Chrome will issue this error if you do so. – Raptor Commented Mar 23, 2012 at 3:04
• so how to solve this problem? – chaohuang Commented Mar 23, 2012 at 3:07

2 Answers 2

To be very specific about your problem: you need to add the hosts you want to be able to access in cross-domain to your extension manifest:

http://code.google./chrome/extensions/xhr.html

{
  "name": "My extension",
  ...
  "permissions": [
    "https://*.minus./"
  ],
  ...
}

edit

on a side note, I sometimes get weird cross-domain errors in my chrome when I have a LOT of extensions active. I then have to disable at least a couple, the refresh the extension and it works - or sometimes restart chrome.

You solve it by making your application a packaged application which does support cross domain calls. Hosted applications do not.

You may also want to read Cross-Origin XMLHttpRequest in chrome extensions