Ajax cross-domain call webservice implementation code

Recently, ajax has encountered cross-domain problems when accessing webservice. I searched for information on the Internet and summarized it as follows (many of them are copied from other people’s summaries that I think are good)

　< >

First, my implemented code:

Front-end code:

$.ajax({ type: "get", url: "http://localhost/Service1.asmx/getElevatorStatusJsonData?jsoncallback=?", dataType: "jsonp", jsonp: "json", data: "", success: function (result) { var data = eval(result); for (var i = 0; i < data.length; i++) { alert(data[i].ID + "--" + data[i].Name); } }, error: function (a, b, c) { alert(c); } });

Server-side code:

/// 
 /// 获取状态数据信息 /// 
 ///  [WebMethod] public void getElevatorStatusJsonData() { List> elevatordatas = new List>(); List searchList = XmlSerializeHelper.XmlDeserializeFromFile>(@ConfigUtil.servicePath + ConfigUtil.getConfigByKey("xmlPath") + "查询指令信息.xml", Encoding.UTF8); foreach (SendDicdate item in searchList) { string key = item.portno + "-" + item.bordrate + "-" + item.sendtype; List deviceInfoList = (List)Context.Cache.Get(key); elevatordatas.Add(deviceInfoList); } String result = ""; DataContractJsonSerializer json = new DataContractJsonSerializer(elevatordatas.GetType()); using (MemoryStream stream = new MemoryStream()) { json.WriteObject(stream, elevatordatas); result = Encoding.UTF8.GetString(stream.ToArray()); } String jsoncallback = HttpContext.Current.Request["jsoncallback"]; result = jsoncallback + '(' + result + ')'; HttpContext.Current.Response.Write(result); HttpContext.Current.Response.End(); }

c

# The above is the implementation code for calling the c# server. The following is the java side. The parameters may be different, but the principles are the same

java:

String callbackFunName = context.Request["callbackparam"]; 　　context.Response.Write(callbackFunName + "([ { \"name\":\"John\"}])");

PS: The jsonp parameter on the client side is used to pass parameters through the url, and the parameter name of the jsonpCallback parameter is passed. It is a bit difficult to pronounce. To put it in layman’s terms:

jsonp: ""

jsonpCallback:""

By the way: In the chrome browser, you can also set header information on the server context.Response.AddHeader("Access-Control-Allow-Origin", "*"); To achieve the purpose of cross-domain requests, and there is no need to set the following ajax parameters

dataType : "jsonp", 　　jsonp: "callbackparam", 　　jsonpCallback:"jsonpCallback1"

Data can be obtained in the normal ajax request method.

The following is the principle. I think it makes sense after reading what others have explained:

1. A well-known problem. Ajax directly requests ordinary files, which causes cross-domain unauthorized access. I don’t care about you. It is a static page, dynamic web page, web service, WCF. As long as it is a cross-domain request, it is not allowed;

　2. However, we also found that when calling js files on the Web page, it is not affected by whether it is cross-domain. (Not only that, we also found that all tags with the "src" attribute have cross-domain capabilities, such as

3. So it can be judged that at the current stage, if you want to use the pure web side (ActiveX control, server There is only one possibility to access data across domains (not counting proxies, Websockets and other methods that belong to future HTML5), and that is to try to load the data into a js format file on the remote server for client calling and further processing;

　4. We happen to already know that there is a pure character data format called JSON that can describe complex data concisely. What’s even better is that JSON is also natively supported by js, so the client can handle this format almost as desired. Data;

　5. In this way, the solution is ready. The web client calls the dynamically generated js format file (usually with JSON as the suffix) on the cross-domain server in exactly the same way as the calling script. It is obvious. , the reason why the server dynamically generates the JSON file is to load the data needed by the client.

　6. After the client successfully calls the JSON file, it also obtains the data it needs. , the rest is to process and display according to your own needs. This method of obtaining remote data looks very much like AJAX, but it is actually different.

　7. In order to facilitate the client to use the data, it is gradually formed. An informal transmission protocol, people call it JSONP. One of the key points of this protocol is to allow users to pass a callback parameter to the server. Then when the server returns data, it will use this callback parameter as a function name to wrap the JSON data. , so that the client can customize its own function to automatically process the returned data

Smart developers can easily think that as long as the js script provided by the server is dynamically generated, then the caller will be fine. You can pass a parameter to tell the server "I want a js code that calls the XXX function, please return it to me." Then the server can generate the js script according to the client's needs and respond

.

Automatically generate a callback function for you and take out the data for the success attribute method to call

For more articles related to the implementation code of ajax cross-domain calling webservice, please pay attention to PHP Chinese website!