Home > Developer > PHP

PHP JSONP

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


First look at an instance

The code is as follows: Copy code


$ ("# Btn"). click (function (k ){
//...
Var j = form. serializeArray (); // serialize name/value
$. Ajax ({
Url: "Another domain name/test. php ",
DataType: 'jsonp ',
Data: j,
Jsonp: 'jsonp _ callback ',
Success: function (json) {// returned json data
Json = json | {};
If (json. msg = 'err '){
Alert (json.info );
} Else if (json. msg = "OK "){
Alert ('submitted successfully ');
} Else {
Alert ('submission failed ');
            }
},
Timeout: 3000
})
//...
});


Php section:

The code is as follows: Copy code
$ Jsonp_callback = $ _ GET ['json_callback'];
//...
// If correct
Echo $ jsonp_callback, '({"msg": "OK "})';
5. // if an error occurs
Echo $ jsonp_callback, '({"msg": "err", "info": "failed to send due to character issues "})';

//... It is worth noting that the jsonp method is used, and beforeSend/error cannot be used. Therefore, the verification implemented by js in beforeSend can only be performed by ajax on the server side. php has been verified above.

The domain name contains the following HTML file testjsonp.html:

The code is as follows:

The code is as follows: Copy code

<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<Html xmlns = "http://www.w3.org/5o/xhtml">
<Head>
<Title> Untitled Page </title>
<Script type = "text/javascript" src = "jquery-1.7.2.min.js"> </script>
<Script type = "text/javascript">
JQuery (document). ready (function (){
$. Ajax ({
Type: "GET",
Async: false,
// Url: "http: // test/jsonp. php",
Url: "http://mytaobao.com/jsonp.php",
DataType: "jsonp",
Jsonp: "callback", // The parameter name passed to the request handler or page to obtain the jsonp callback function name (usually the default value is callback)
JsonpCallback: "flightHandler", // custom jsonp callback function name. The default value is the random function name automatically generated by jQuery. You can also write "? ", JQuery will automatically process the data for you
Success: function (json ){
Alert ('You found the flight information: fare: '+ json. price +' yuan, remaining ticket: '+ json. tickets +. Callback function name: '+ json. func );
},
Error: function (){
Alert ("fail");
             }
});
});
</Script>
</Head>
<Body>
</Body>
</Html>

Note: to truly run the above code, you may need jquery files.

The code is as follows: Copy code
<Script type = "text/javascript" src = "jquery-1.7.2.min.js"> </script>

Change the file path of jquery in your Directory:
For example:

The code is as follows: Copy code
<Script type = "text/javascript" src = "js/jquery. js"> </script>

Then, you can find a web directory for another domain name, and set the file jsonp. php:

The code is as follows:

The code is as follows: Copy code
<? Php
$ Callback = $ _ GET ["callback"];
$ A = array (
'Code' => '000098 ',
'Price' => '123 ',
'Tickets '=> 20,
'Function' => $ callback,
);
$ Result = json_encode ($ );
Echo "flightHandler ($ result)";
Exit;

Put it under this directory. In this way, you can test it.
You can see the effect directly on the browser testjsonp.html.

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.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

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