Question

I am using JQuery, FLXHR for getting the data from Cross Browser.

Below is the sample jquery code:

        // set up the domain that we're going to call and tell flXHR not to try to parse the response as XML..
 $.flXHRproxy.registerOptions("http://staging/", {xmlResponseText:false});

 // set flXHR as the default XHR object used in jQuery AJAX requests
 $.ajaxSetup({transport:'flXHRproxy'});


 $.ajax({  
        type:"POST",        
        url: "http://staging/Login.aspx",  // Send the login info to this page
        data: str, 
        dataType: "json", 
        success: function(result)
        { 
             // Show 'Submit' Button
            $('#loginButton').show();

            // Hide Gif Spinning Rotator
            $('#ajaxloading').hide();  
        } 

    });  

In above code I am using JQuery and Flash to have cross browser interaction, above code is working fine, with http://staging/Login.aspx, however when I am going for https://staging/Login.aspx (HTTPS) authentication its giving me error (NS_ERROR_PROXY_CONNECTION_REFUSED).

Please suggest how to get rid of this issue.

Thanks.

Answer 1

I resolved my issue with given below code changes.

I took the help of below articles.

1) http://www.offshootinc.com/blog/2010/03/12/cross-domain-scripting-with-jquery-and-flxhr/

2) http://tek-insight.blogspot.com/2010/05/cross-domain-ajax-request-proxy-json.html

3) http://flxhr.flensed.com

We have to download plugin from FLXHR website and have to copy the contents of “Deploy” folder in same location where all the Javascript are kept.

Below is sample code of crossdomain.xml which we need to copy on the root directory of your website.

<?xml version="1.0"?>
<!DOCTYPE cross-domain-policy SYSTEM "http://www.adobe.com/xml/dtds/cross-domain-policy.dtd">
<cross-domain-policy>
  <site-control permitted-cross-domain-policies="master-only"/>
   <allow-access-from domain="*" secure="false"/>
   <allow-http-request-headers-from domain="*" headers="*"  secure="false"/>
</cross-domain-policy>

Here goes JQuery Code:

    var ajaxGatewayUrl = "https://staging/login/login.aspx";
    var loadPolicyURL = "https://staging/crossdomain.xml"

    // set flXHR as the default XHR object used in jQuery AJAX requests
    $.ajaxSetup({transport:'flXHRproxy'});
    // set up the domain that we're going to call and tell flXHR not to try to parse the response as XML..
    $.flXHRproxy.registerOptions(ajaxGatewayUrl,{xmlResponseText:false,loadPolicyURL:loadPolicyURL});

 //Submitting the form
$("#loginDetails > form").submit(function()
{
     //Hiding the Login button
    $("#loginButton").hide();

    //Showing the ajax loading image
    $("#ajaxloading").show();

    // 'this' refers to the current submitted form  
    var str = $(this).serialize();   
    // -- Start AJAX Call --

    $.ajax({ 
        type:"POST",        
        url: ajaxGatewayUrl,  // Send the login info to this page
        data:str, 
        cache:false,
        dataType: "json",        
        success: function(result)
        {  
             // Show 'Submit' Button
            $('#loginButton').show();

            // Hide Gif Spinning Rotator
            $('#ajaxloading').hide();  

            if(result.Response!='NULL')
            {     

                     $('.validateTips').hide();
                    var login_response = '<div id="logged_in">' +
                     '<div style="width: 350px; float: left; margin-left: 80px;">' + 
                     '<div style="width: 40px; float: left;">' +
                     '<img style="margin: 22px 0px 10px 0px;" align="absmiddle" src="system/images/ajax-loader.gif">' +
                     '</div>' +
                     '<div style="margin: 24px 0px 0px 10px; float: right; width: 300px;">'+ 
                     "You are successfully logged in! <br /> Please wait while you're redirected...</div></div>";  

                    $('#loginButton').hide();
                    $('#closeBtn').hide();
                    $('#divMember').text(result.FirstName +' '+ result.LastName);
                    $('#spnSkywardsNo').text(result.ActiveCardNo);
                    $('#spnTierStatus').text(result.MemberShipTier);
                    $("#ui-dialog-title-skywardsLogin").text(getDataFromResourceFile('pleaseWait'));

                    $('#divSuccessLogin').html(login_response);
                    $('#divSuccessLogin').show();
                    $('#loginDetails').hide();



                    // After 3 seconds redirect the 
                    setTimeout(closeDialog, 3000); 
              }
            else// ERROR?
             {  
                 var login_response = getDataFromResourceFile('InvalidUsername');
                 $('.validateTips').html(login_response);
             }
        }, 
        error:function(request, textStatus, errorThrown)
        {
            // Show 'Submit' Button
            $('#loginButton').show();

            // Hide Gif Spinning Rotator
            $('#ajaxloading').hide();  

            $('.validateTips').html("Some Issue with requested URL");
        } 

    });  

    // -- End AJAX Call --

    return false; 
});

Please have a look to above implementation and suggest for good inputs.