Question

There is a demand to make cross domain request to a remote service in chrome extension via ajax.

All works properly while user is authorized on a service before he/she uses the extension. But when an unathorized user makes a request extension fails with 401 error code (unathorized).

My sake is to accomplish browser like appearance. If you aren’t authorized on some webpage browser dialog-box appears suggesting you to input your credentials. Since they are correct browser display webpage content.

I’ve tried to add to extensions HTML layout some invisible element that lies on a service to force browser built-in domain authorization dialog appear, but id doesn’t seem to be correct approach.

Long story short, do you know some strategy to force browser built-in authorization from chrome extension or simply via javascript code without redirecting user to some separate service webpage. Or, maybe, this is impossible and why?

Code that makes request is simple:

$.ajax({
    url: 'service url that requires authorization',
    dataType: 'json',
    success: function (info){
        //success handler
    },
    error: function (){
        //error handler
    }
});

WBR, Vitaliy

Answer 1

I think it is possible to listen to chrome.webRequest.onAuthRequired ( https://developer.chrome.com/trunk/extensions/webRequest.html#event-onAuthRequired). In the event listener, you can prompt the user to enter credentials, say, by showing a custom window that looks like the built-in authorization dialog. onAuthRequired is the only event in chrome.webRequest which supports asynchronized blocking, which allows you to fetch credentials (from the user) asynchronously and pass the response (credentials).

chrome.webRequest.onAuthRequired.addListener(function(details, callback){
    // Prompt the user to enter credentials. Call 
    // callback({authCredentials: {username: xxx, password: xxx}});
    // when they are ready.
}, {.../*request filter*/}, ['asyncBlocking']);