Jquery Ajax Web服务和跨域问题

时间:2011-01-29 03:20:23

标签: asp.net jquery ajax web-services crossdomain.xml

我的Jqueryajax调用有问题,它将通过跨域使用我的一个Web服务方法。我一直在尝试所有可能的方式来完成但仍然没有成功。请帮我解决我做错的事。我可能需要为某些安全设置配置Web服务器吗?下面是我的代码。如果您对我的代码有任何疑问,请告诉我。

//Using Ajax Post
//Webservice will return JSON Format
//Doesn't work in both FF and IE when host to live server , work in local
//Error : Access is denined in xxxx.js in IE
//Http 403 Forbidden in FF , FF request header is OPTION
//this approach is the simplest and best way for me to use


    var myID = $("myID").val();
   $.ajax({
    type: "POST",        
    url: "http://www.mywebsite.com/webservice/Webservice.asmx/getInfo",
    data: "{myID:'"+ myID + "'}",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function(data) {

           Dostuff(data);
        },

    error: FailureCallBack

});

我的网络服务将如下所示

using System.Web.Script.Services;
[WebService(Namespace = "http://www.mywebsite.com/webservice/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[ScriptService]
public class Webservice : System.Web.Services.WebService
{
    [WebMethod]
    [ScriptMethod(ResponseFormat = ResponseFormat.Json)]
    public object getInfo(string myID)
    {       
            //Do stuff here
            return getJSONDataFromDataSet(_DS); 
    } 


}

//second Approch <br/>
//Using Ajax GET , webservice will return XML Format <br/>
//Doesn't work in both FF and IE when host to live <br/>
//Error : Access is denined in xxxx.js in IE <br/>
//returning XML data in FF but showing nothing in page <br/>

var myID = $("myID").val();
     $.ajax({

        type: "GET",

        url: "http://www.mywebsite.com/webservice/Webservice.asmx/getInfo?myID="myID"&callback=?",    

        success: function(data) {

                Dostuff(data);
            },

        error: FailureCallBack

    });

web服务

public SerializableDictionary<string, object> getInfo(string myID)
    {         
     //Do stuff here
            SerializableDictionary<string, object> obj = getJSONFromDataTable(_DS);            
            return obj;            
    }

//third Approch
//Using normal GET , webservice will return XML Format
//same problem with second approch



var myID = $("myID").val();
    var xmlhttprequest = createRequestObject();
    var url = 'http://www.mywebsite.com/webservice/Webservice.asmx/getInfo?myID='myID'';
    xmlhttprequest.open("GET", url, true);
    xmlhttprequest.onreadystatechange = getData;
    xmlhttprequest.send(null);
function getData() 
{
  if ((xmlhttprequest.readyState == 4) &&( xmlhttprequest.status == 200))
  {    
    var myXml = xmlhttprequest.responseXML;
    Dostuff(myXml);
  } 
}
function createRequestObject() 
{
      if (window.XMLHttpRequest) 
      {
                return xmlhttprequest = new XMLHttpRequest(); 
      } 
      else if (window.ActiveXObject) 
      {  
            return xmlhttprequest = new ActiveXObject("Microsoft.XMLHTTP"); 
      } 
}

Webservice与第二种方法相同

编辑: 现在我得到Access被拒绝,IE中的POST和GET请求的javascript错误。 在fiddler我可以看到Firefox返回Xml数据但没有显示在页面中,所以我在getData中放了一个警告框 函数,myXml变量值总是为null,奇怪我只放了1个警告框,它显示警报3次。 下面是我的代码

  var myID = $("myID").val();
    var xmlhttprequest = createRequestObject();
    var encodeUrl = escape(_utf8_encode("http://www.mywebsite.com/webservice/Webservice.asmx/getInfo?myID="myID)); 
    var url = 'http://www.mywebsite.com/webservice/proxy.aspx?url='+encodeUrl;
    xmlhttprequest.open("GET", url, true); //**ACCESS IS DENIED HERE in this line!!!!**
    xmlhttprequest.onreadystatechange = getData;
    xmlhttprequest.send(null);


function getData() 
{
    var myXml = xmlhttprequest.responseXML;
    alert(myXml); //ALWAYS NULL and show alert 3 times????
    DoStuff(myXml);
}

请帮忙。 最好的问候

3 个答案:

答案 0 :(得分:3)

出于安全原因,ajax请求不能跨域工作。有两种解决方案。

  1. 向同一台服务器发出请求,并使用基于服务器的代理机制,然后向其他域发出请求。

  2. 使用“JSONP”,这是使ajax像请求一样的另一种交叉方式。 jQuery通过dataType:jsonp而不是json支持这个,并且通过他们的api文档进一步解释。此博客条目可能很有用 - http://bloggingabout.net/blogs/adelkhalil/archive/2009/08/14/cross-domain-jsonp-with-jquery-call-step-by-step-guide.aspx

答案 1 :(得分:1)

您需要在您的域上创建代理并传递请求,请在此处说明:http://www.johnchapman.name/aspnet-proxy-page-cross-domain-requests-from-ajax-and-javascript/

答案 2 :(得分:0)

非常感谢所有的回复和帮助。 我已经解决了这个问题:D 解决方案是使用JSONP和Javascript动态注入到html页面。 下面是代码

HTML

<body>
<script type="text/javascript">
var url = "http://www.mywebsite.com/Javascript/MYJS.js";

var script = document.createElement("script");       
script.setAttribute("src",url);
script.setAttribute("type","text/javascript");                
document.body.appendChild(script);
</body>
</script>

MYJS.js

var myID = $("#myID").val();
var url = "http://www.mywebsite.com/Webservice.aspx/getInfo?myID="+myID+"";

   if (url.indexOf("?") > -1)
            url += "&jsonp=" ;
        else
            url += "?jsonp=" ;
        url += "ShowInfoCallback" + "&" ; //Important put ur callback function to capture the JSONP data

       url += new Date().getTime().toString(); // prevent caching        




var script = document.createElement("script");        
    script.setAttribute("src",url);

    script.setAttribute("type","text/javascript");                
    document.body.appendChild(script);


function ShowInfoCallback(data)
{
 DoWhateverYouWant(data);    
}

Webservice.aspx.cs

using System.Web.Script.Serialization;
public partial class Webservice : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!string.IsNullOrEmpty(Request.QueryString["myID"]))
            this.getInfo();
        else
            this.getInfoDetails();

    }
    public void getInfo()
    {
        string Callback = Request.QueryString["jsonp"];
        string encryptedID = Request.QueryString["myID"];

        //Dowhateveryouwanthere

        object obj = getJSONFromDataTable(myDataSet.Tables[1]);
        JavaScriptSerializer oSerializer = new JavaScriptSerializer();
        string sJSON = oSerializer.Serialize(obj);
        Response.Write(Callback + "( " + sJSON + " );");
        Response.End();
    }
    public void getInfoDetails()
    {
        //Same as above
 //returning 2 tables , Info and InfoDetails
        Response.Write(Callback + "( { 'Info' : " + sJSONDetails +",'InfoDetails' : "+ sJSONService + " } );");
        Response.End();
    }
}

再次感谢