Shulou(Shulou.com)06/03 Report--

What are the points for attention in the use of jQuery Ajax? in view of this problem, this article introduces the corresponding analysis and solution in detail, hoping to help more partners who want to solve this problem to find a more simple and feasible way.

If GET is used in IE7 and the following request methods, the limitation of URL is easy to ignore (a maximum of 2083 characters). So if URL is likely to be too long, be sure to use POST.

Terminate an Ajax request

You need to call the abort () method of the XMLHttpRequest object to terminate the request

In jQuery, $.get, $.post, $.ajax, $.getJSON, $.getscript. The return values are all XMLHttpRequest objects.

After calling abort (), the ajax request stops immediately, but the callback function of success is still executed.

Therefore, in the callback function of success, you need to determine whether ajaxGet or data exists before executing the callback function.

The code is as follows:

Var ajaxGet = $.get (someURL,someData,function (data) {

If (! data) return true

/ / TODO

});

AjaxGet.abort ()

When it comes to cross-domain resource sharing (CORS Cross-Origin Resoure Sharing), it is becoming more and more important. All kinds of maps API, Weibo API and so on, website developers do not have to put satellites on their own, as long as according to other people's open interfaces, they can get these data.

This is due to the cross-source strategy.

JSONP is a solution of cross-source strategy. The basic principle is to make use of the characteristic that the browser allows cross-domain access to script resources (including pictures) to generate script Tag on the server side and send it back to the client side.

Note that instead of returning a string in JSON format, the server returns a callbackName+ "(" + JSON_string+ "), which is JSONP.

This is equivalent to the server returning a piece of JS code (the assigned function) to the browser and executing it immediately.

Therefore, in the URL sent by the browser (in the form of GET), you need to pass in the callback function name.

Client:

The code is as follows:

Function deal (data) {

/ / TODO

}

Var s = document.createElement ("script")

/ / it doesn't have to be callback, but it must match the server-side Request.QueryString.

S.src = "http://172.20.2.60:8088/newwebsite/MyHandler.ashx?callback=func";

Document.body.appendChild (s)

Server side (.net)

The code is as follows:

Using System

Using System.Web

Public class Test: IHttpHandler {

Public void ProcessRequest (HttpContext context) {

Context.Response.Charset = "utf-8"

Context.Response.ContentType = "text/javascript"

String callback = context.Request.QueryString ["callback"]; / / callback function name

String json = "{'name':'Ray','msg':'hello worldview'}"; / / string in JSON format

String result = string.Format ("{0} ({1})", callback, json)

Context.Response.Write (result)

Context.Response.Flush ()

Context.Response.End ()

}

Public bool IsReusable {

Get {

Return false

}

}

}

If you use jQuery, there is no need to add the callback function name to URL, because jQuery is already doing it for you, and this callback function is success.

The code is as follows:

$.ajax ({

Url: "http://172.20.2.60:8088/newwebsite/MyHandler.ashx"

, dataType: "jsonp"

, success: function (data) {

/ / TODO

}

});

JSONP is powerful, but there are two troubling things. The first is security.

In any case, you are tossing data from other people's territory, and the content is still a script! In other words, if someone is a bad person and gives you some malicious code, it will not be easy to do.

Of course, this problem generally does not happen. After all, the places I want to request data are familiar or official (Google Maps API, Sina Weibo API obviously won't trick you).

The other question is disturbing. It is not directly known whether the browser's request for JSONP has failed or not. Even using jQuery,error doesn't work. Even if something goes wrong, try,catch can't catch it.

So the only imperfect way to know for now is to set a time limit, and if no data is returned beyond the time limit, then determine the error. It is said that it is not perfect because the Internet speed of each home is different, so. You know.

ContentType correlation in jQuery

The code is as follows:

ContentType

Default: 'application/x-www-form-urlencoded; charset=UTF-8'

When sending data to the server, use this content type.

Default is "application/x-www-form-urlencoded; charset=UTF-8", which is fine for most cases.

If you explicitly pass in a content-type to $.ajax ()

Then it'll always be sent to the server (even if no data is sent).

If no charset is specified, data will be transmitted to the server using the server's default charset

You must decode this appropriately on the server side.

From this passage, we can see that in jQuery ajax, contentType defaults to 'application/x-www-form-urlencoded; charset=UTF-8', of course, which is the latest version of jQuery. There is a slight change from the previous version.

If you want to serialize an object and pass it to the background, you can set contentType to 'application/json'

This is the answer to the question about what matters needing attention in the use of jQuery Ajax. I hope the above content can be of some help to you. If you still have a lot of doubts to be solved, you can follow the industry information channel to learn more about it.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.