Cross-domain request jquery ajax Jsonp Use FAQ

Cross-domain request jquery ajax Jsonp Use FAQ _jquery

Last Update:2017-01-19 Source: Internet

Author: User

Tags error handling script tag

Developer on Alibaba Coud: Build your first app with APIs, SDKs, and tutorials on the Alibaba Cloud. Read more ＞

It was not used before the error--ajax Jsonp was executed directly. To its understanding of the same as ordinary Ajax request, no in-depth understanding of this error, after debugging (check the background code and JS section of the property settings) or not, let me feel very surprised and puzzled. So, decided to carefully study the use of Ajax Jsonp, and the final test of successful learning experience and share with you!
First, post code that can be executed successfully:
(Page section)

Copy Code code as follows:

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<title>untitled page</title>
<script type= "Text/javascript" src= "Http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" ></ Script>
<script type= "Text/javascript" >
JQuery (document). Ready (function () {
$.ajax ({
Type: "Get",
Async:false,
URL: "Ajax.ashx",
DataType: "Jsonp",
JSONP: "Callbackparam",//passed to the request handler or page to obtain the parameter name of the JSONP callback function name (default: Callback)
Jsonpcallback: "Success_jsonpcallback",//Custom JSONP callback function name, default to jquery automatically generated random function name
Success:function (JSON) {
alert (JSON);
alert (json[0].name);
},
Error:function () {
Alert (' fail ');
}
});
var a= "FirstName Brett";
alert (a);
});
</script>
<body>
</body>

(part of the handler)

Copy Code code as follows:

<%@ WebHandler language= "C #" class= "Ajax"%>
Using System;
Using System.Web;
public class Ajax:ihttphandler {
public void ProcessRequest (HttpContext context) {
Context. Response.ContentType = "Text/plain";
String callbackfunname = context. request["Callbackparam"];
Context. Response.Write (Callbackfunname + "([{name:\" john\ "}])");
}
public bool IsReusable {
get {
return false;
}
}
}

(Request grab screenshot)

Ajax Request Parameter Description:
DataType String
The type of data expected to be returned by the server. If not specified, JQuery will automatically intelligently judge against HTTP packet mime information, such as XML MIME types being recognized as XML. In 1.4, JSON generates a JavaScript object, and script executes it. The data returned by the server side is then parsed against this value and passed to the callback function. Available values:
"XML": Returns an XML document that can be processed with jQuery.
HTML: Returns plain text HTML information, and the included script tag executes when the DOM is inserted.
Script: Returns the plain text JavaScript code. Results are not automatically cached. Unless the "cache" parameter is set. ' Note: ' At remote request (not in the same domain), all post requests will be converted to get requests. (because it will be loaded using the DOM's script tag)
"JSON": Returns JSON data.
"JSONP": Jsonp format. When calling a function using JSONP form, such as "myurl?callback=?" JQuery is automatically replaced? To the correct function name to execute the callback function.
' Text ': Returns a plain text string
Jsonp String
Overrides the name of the callback function in a JSONP request. This value is used to replace the "callback=?" The "callback" section of the URL parameter in this get or POST request, such as {jsonp: ' Onjsonpload '}, will cause the "onjsonpload=?" passed to the server.
Jsonpcallback String
Specifies a callback function name for the JSONP request. This value will be used to replace the random function name that jquery automatically generates. This is primarily used to allow jquery to generate unique function names, which makes it easier to manage requests and easily provides callback functions and error handling. You can also specify this callback function name when you want the browser to cache a GET request.
The main difference between Ajax Jsonp and ordinary AJAX requests is the processing of request response results. The response, as shown in the code above, is:
Success_jsonpcallback ([{name: "John"}]); ———— actually, calling the JSONP callback function Success_jsonpcallback and passing in the response string or JSON to this method (as a parameter value), the underlying implementation, presumably, should be:

Copy Code code as follows:

function Success_jsonpcallback (data)
{
Success (data);
}

After testing, Ajax Jsonp have no effect on synchronous or asynchronous requests. Well, if there is an explanation or incomplete place, I hope everyone forgive me, welcome message, throw Brick!

This article is an English version of an article which is originally in the Chinese language on aliyun.com and is provided for information purposes only. This website makes no representation or warranty of any kind, either expressed or implied, as to the accuracy, completeness ownership or reliability of the article or any translations thereof. If you have any concerns or complaints relating to the article, please send an email, providing a detailed description of the concern or complaint, to info-contact@alibabacloud.com. A staff member will contact you within 5 working days. Once verified, infringing content will be removed immediately.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

Get Started for Free

Sales Support

1 on 1 presale consultation

Chat Contact Sales
After-Sales Support

24/7 Technical Support 6 Free Tickets per Quarter Faster Response

Open a Ticket
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.

Learn More