如何使用JQuery实现FLXHR进行跨域交互

问题描述：

我正在使用JQuery，FLXHR从跨浏览器获取数据.

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

下面是示例 jquery代码:

        // 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();  
        } 

    });

在上面的代码中，我正在使用JQuery和Flash进行跨浏览器交互，上面的代码在 http://staging/Login.aspx 上工作正常，但是当我要使用 https://staging/Login.aspx (HTTPS)身份验证，它会给我错误(NS_ERROR_PROXY_CONNECTION_REFUSED).

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.

谢谢.

答

我通过以下代码更改解决了我的问题.

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

我们必须从 FLXHR网站下载插件，并且必须将部署" 文件夹的内容复制到所有 Javascript 所在的位置被保留.

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.

下面是 crossdomain.xml 的示例代码，我们需要将其复制到您网站的根目录中.

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>

这里是 Jquery代码:

    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.

如何使用JQuery实现FLXHR进行跨域交互

相关推荐