Home > Developer > Web Develop

Jsonp for cross-domain access

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

The idea of JSONP is very simple.

    1. Front-end Create script tag, set SRC, add to head (you can add to body)
    2. Backstage returns a JS variable Jsonp, this JSONP is the JSON data after the request
    3. Delete the script tag when the callback is complete (there are some cleanup tasks such as avoiding some browser memory leaks, etc.)

Interface

12345 Sjax.load(    url, // 跨越请求的URL    success,  // 回调函数，必须定义一个形参，用于接收后台返回的全局变量jsonp （约定后台返回如jsonp = {...}结构）    timestamp, // 传true会加一个时间戳，防止缓存，默认不加);

Example:

12345678910111213141516171819202122 <!DOCTYPE HTML>    <meta charset="utf-8">    <title>sjax_0.1.js by snandy</title>    <script src="http://files.cnblogs.com/snandy/sjax_0.1.js"></script><body><p id="p1"style="background:gold;"></p><input type="button"value="Get Name"onclick="clk()"/><script type="text/javascript">    functionclk(){        Sjax.load(            ‘http://files.cnblogs.com/snandy/jsonp.js‘,            function(){                document.getElementById(‘p1‘).innerHTML = ‘Hi, ‘+ jsonp.name;            }        );         }</script></body>

　　

This HTML implementation of a simple front and back interactive function, click the button "Get Name", get to Name after the show on the paragraph p.

The Sjax.load method is called in the CLK function, and S in Sjax is the script. I used the Ajax name in my Ajax series, and here we use Sjax.

The requested background URL is jsonp.js, which returns the following

1 jsonp = {name:‘jack‘};

Because it is a test, it is implemented in the simplest way. The background of the request actually does not have to be the JS file, can be php,java and so on any background language, they may connect the database to carry on a series of business query. In short, it must return the structure of the variable JSONP, this variable is a JS object, as to how complex there is no need to pay attention to.

Jsonp for cross-domain access

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.

Related Keywords:
jsonp example php domain access access 2003 for dummies access 2010 for dummies cross domain cookies php system access for windows access forms for dummies

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.

What's Trending
Top 10 Tags
datastax versions naming convention zookeeper client class definition md5 microsoft sql server 2005 data structures exception handling error handling
Top 10 Keywords
microsoft download center down wordpress address url site address url wordpress address url windows installer 4 0 download 302 not found web address url definition site address url wordpress db2 integer mac os installation step by step pdf abbreviation for return

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