JSONP cross-domain

Source: Internet
Author: User

Why cross-domain, because the browser's homologous policy. Data from other domains cannot be accessed in this domain. That is, you can't get anything from someone else's house in your own home. The same people can not get your home things, even if you do not lock the door of your things others are not to be able to take their own things. This is the homologous strategy. But there is no way to ask for a favor in life, but always borrow something from the neighbors, how to borrow it?

There are several elements in JavaScript that can be cross-domain:

Img/iframe/link/ script .... May be more later, first of all, the common feature is that you can introduce external files, regardless of where the external file is, then this is equivalent to success across the domain.

Cross-domain using the SRC attribute of the script

1. There is a one.js file under our one.com, and its code is:

Alert (' I am one.com/one.html ');

2. There is a two.html file under our two.com. Its code is:

<!DOCTYPE HTML><HTML><HeadLang= "en">    <MetaCharSet= "UTF-8">    <title></title></Head><Body><Scriptsrc= "Http://one.com/one.js"></Script></Body></HTML>

So what happens when you execute two.html? Will pop up "I am one.com/one.js" This is no problem. Then this succeeds in introducing an external JS file across domains and executing it.

Cross-domain with <script> src: By assigning a different source file address to SRC, the string browser returned by this file will be executed as JavaScript code, then the string will contain the data we want to request. After the data request, I can define a method Jsonpfun () on this page to process the obtained data, and the obtained string can directly call the method Jsonpfun () and send the data in the form of parameters. For example, in the code above, modify the code in two.html to:

<script>    function  jsonpfun (data) {        alert (data)    }</script><script src = "Http://one.com/one.js" ></script>

Modify the code in One.js to:

Jsonpfun (' I am one.com/one.js ');

then run two.html naturally will pop up " I am one.com/one.js" This is no problem. Because the Jsonpfun () method defined in the Two.html page has been called in One.js and passed the parameter to the method.

If the data is loaded dynamically then the JS code in the two.html will be written like this:

function creatscript (URL) {       var script = document.createelement (' script ');        = URL;       Document.body.appendChild (script);   }    function Jsonpfun (data) {       alert (data);   }    // you need to call a function across domains and pass in the name   of the returned data function. Creatscript (' Http://one.com/one.aspx?callback=jsonpFun ');

The above code is requested in an ASPX format file, this address more than one? Callback=jsonpfun this extra string means to pass the name of the function that this page is working with. This, of course, is a combination of background code:

ProtectedvoidPage_Load (object sender, EventArgs e) {if( This. IsPostBack = =false) {String callback= ""; if(request["Callback"]! =NULL) {Callback= request["Callback"]; //data to be returned by the server sideString data = "I am a string in a background aspx file"; Response.Write (Callback+ "(" + Data + ")"); }        }    }

The above Java code means: Get the callback parameter, and then form a function to return it. Then the code running in two.html will return Jsonpfun ("I am a string in the background aspx file"). Call Jsonpfun () directly and pass the arguments.

This is JSONP. Welcome Expert Guidance

JSONP cross-domain

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

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

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

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.