JS cross-Domain and solutions

1. What is a cross-domain

We often use Ajax on the page to request access to data from other servers, where there are cross-domain issues for the client.

Cross-domain issues are caused by the same-origin policy in JavaScript language security restrictions.

In simple terms, the same origin policy refers to a script that can read only the properties of windows and documents from the same source, where the same source refers to a combination of host names, protocols, and port numbers.

For example:

same domain name, different port

URL	Description	whether to allow communication
http://www.a.com/a.js http://www.a.com /b.js	under the same domain name	allow
http://www.a.com/lab/a.js http://www.a.com/script/b.js	different folders under the same domain name	allow
http://www.a.com:8000/a.js http://www.a.com/b.js	does not allow
http://www.a.com/a.js https://www.a.com/b.js	same domain name, different protocol /td>	not allowed
http://www.a.com/a.js http://70.32.92.74/b.js	domain name and domain name corresponding IP	Do not allow
http://www.a.com/a.js http://script.a.com/b.js	primary domain same, subdomain different	not allowed
http://www.a.com/a.js http://a.com/b.js	same domain name, different level two domain name (ibid.)	not allowed (cookies are not allowed in this case Q)
http://www.cnblogs.com/a.js http://www.a.com/b.js	different domain names	do not allow

2. Principle of implementation

In the HTML DOM, a script tag is a cross-domain access to the data on the server. Therefore, you can specify the SRC attribute of the script as a cross-domain URL for cross-domain access.

For example:

This type of access is not possible. But the following is a good way to do it.

<script src= "http://192.168.0.5/Web/web1.aspx" type= "Text/javascript" ></script>

There is a requirement for the returned data, that is, the data returned by the server cannot be simple as {"Name": "Zhangsan"}

If this JSON string is returned, there is no way to reference the string. Therefore, the value to be returned must be var json={"name": "Zhangsan"}, or JSON ({"name ":"Zhangsan"})

In order to make the program not error, we must also establish a JSON function.

3. Solution

Programme I

Server-side:

        protected void Page_Load (object sender, EventArgs e)        {            string result = "callback ({\" name\ ": \" Zhangsan \ ", \" date\ ": \" 2012-12-03\ "})";            Response.Clear ();            Response.Write (result);            Response.End ();        }

Client:

<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "HTTP://WWW.W3.ORG/TR/XHTML1/DTD/XHTML1-TRANSITIONAL.DTD">http://www.w3.org/1999/xhtml">Text/javascript"> var result =NULL; Window.onload = function () {var script = document.createelement ("Script"); Script.type = "Text/javascript"; SCRIPT.SRC = "http://192.168.0.101/ExampleBusinessApplication.Web/web2.aspx"; var head = document.getElementsByTagName ("Head") [0];        Head.insertbefore (script, head.firstchild);        };        function callback (data) {result = data;        } function B_click () {alert (result.name); } </script>Button"value="Click me!"Onclick="B_click ();"/></body>
 

Scenario two, complete with jquery

Through the Jsonp of jquery. Using this approach, there are requirements for the server side.

The server side is as follows:

        protected void Page_Load (object sender, EventArgs e)        {            string callback = request.querystring["  Jsoncallback"];            string result = callback + "({\" name\ ": \" zhangsan\ ", \" date\ ": \" 2012-12-03\ "})";            Response.Clear ();            Response.Write (result);            Response.End ();        }

Client:

$.ajax ({
Asyncfalse,
URL: "http://192.168.0.5/Web/web1.aspx ",
Type: "GET",
DataType: ' Jsonp ',
//jsonp The value of the custom, if using Jsoncallback, then the server side, to return a jsoncallback value corresponding to the object.
JSONP: ' Jsoncallback ',
//To pass the parameters, do not pass the parameter, also must write on
DataNULL,
timeout:5000,
//Return JSON type
ContentType: "Application/json;utf-8",
//The object returned by the server segment contains the Name,data property.
Successfunction(Result) {
Alert(result.date);
},
Errorfunction(JQXHR, Textstatus, Errorthrown) {
Alert(Textstatus);
}
});

In fact, when we execute this JS, JS sends such a request to the server:

http://192.168.0.5/Web/web1.aspx?jsoncallback=jsonp1354505244726&_=1354505244742

The server also returns the following objects:

jsonp1354506338864 ({"name": "zhangsan", "date": "2012-12-03"})

The requirements for cross-domain sample data are realized at this time.

Source: http://www.cnblogs.com/oneword/archive/2012/12/03/2799443.html

JS cross-Domain and solutions