Phonegap + Sencha + Android : ajax request with a basic access authentication failled

Question

I folks,

I'm working on a Phonegap application and the Sencha framework.

I try to reach a protected server but the authentication failed with Android (but not with iOS). I use the code below :

    Ext.Ajax.request({
        url:"http://user:password@api.website.fr/query.json",
        method: 'GET',
        // I tried to send the header directly but it didn't work too
        headers: {
            "Authorization": "Basic s2dh3qs76jd2hqjsdh=="  
        },        
        success: function (result, request) {                 
            alert(result);
        },
        failure: function ( result, request) {            
            for(var key in result)
                alert(result[key]);
        } 
    });

The error message says me that an HTTP digest is required...

Just to know:

• Internet connexion is fine
• The same code works with a local file and other external APIs
• I don't know how to explore Javascript objects in the LogCat so excuse my disgusting alert(result[key])

Thank you guys, you all rock!

Answer 1

I agree with @Mariano. Why can't you try it in the browser and then deploy as an app with phonegap. The cross-domain problem can be solved by starting google chrome from the terminal by this command google-chrome --args --disable-web-security

Check out this link for more information

http://www.senchatouchbits.com/7/cross-domain-ajax-requests.html

Answer 2

I had endless trouble with authenticating my ajax requests but I finally got it to work. I got a basic base64_encode algorithm of the net. Then all you need to to is adjust your header as follows

  Ext.Ajax.request({
            url:'yourwebserviceurl',
            method:'GET',
            headers: {
                Authorization: 'Basic '+ base64_encode(form.username+':'+form.password)
            },    
            success: function(response){
                 //Ext.Msg.alert(response.responseXML);
                 console.log(response.responseText); 
            },
            failure: function(response){
                //console.log('Success response: ' + response.responseText); 
                Ext.Msg.alert('b');                    
            }    
    });

This worked for a basic soap service !

Answer 3

I have the same problem... where you able to fix it?

Btw... you have to set the user and password like this:

Ext.Ajax.request({
    url:"http://api.website.fr/query.json",
    method: 'GET',
    username : 'user',
    password : 'password',
    // I tried to send the header directly but it didn't work too
    headers: {
        "Authorization": "Basic s2dh3qs76jd2hqjsdh=="  
    },        
    success: function (result, request) {                 
        alert(result);
    },
    failure: function ( result, request) {            
        for(var key in result)
            alert(result[key]);
    } 
});

Answer 4

Use console.log to see what a js object have, you allways must try the app in a browser with a debbuger like Firebug to detect issues more easy.

To your problem in Android, make sure this line is in phonegap app manifest file: < uses-permission android:name="android.permission.INTERNET" >< /uses- permission >

Good Luck!

Answer 5

This is a cross domain request problem. You have to modify your code to create a JSONP request

Ext.util.JSONP.request({
        url: 'http://url',
        callbackKey: 'callback',
        callbackName: 'callback',
        model: 'Model',

        params: {},

        callback: function(result){
            var shows = result.data;                        
        },                  
    });

Keep in mind that you have to adapt also the server side, so that the respone for it is a jsonp result (callback)