3 common methods for JS cross-domain Request data _javascript Tips

Because of the influence of JS homology policy, when requesting other domain names under a domain name, or the same domain name, the URLs under different ports will become Cross-domain requests that are not allowed.
Then how do you usually solve this, the rookie bald I have a little finishing:
1.JavaScript
In the case of native JS (without jquery and Ajax support), the client code is usually like this (I assume it is under the localhost:8080 port of http://localhost:8080/webs/i.mediapower.mobi/ Add the following code below the Body tab of the wutao/index.html page:

<script>
  var xhr = new XMLHttpRequest ();
  Xhr.open ("Get", "Http://i2.mediapower.mobi/adpower/vm/Bora/js/test.js", true);
  Xhr.onreadystatechange = function () {
    if (xhr.readystate = = 4 && xhr.status =) {
      Console.log (xhr.res Ponsetext);
    }
  ;
  Xhr.send (null);
</script>

Save, the browser opens the http://localhost:8080/webs/i.mediapower.mobi/wutao/index.html, and the console console opens:

The browser is very ruthless to give you a homology limit error, meaning that you cannot request URL data across domains.
So, I'll take the first strategy and insert the JS script using the script tag in HTML:
(1) by using the script tag quote, write the URL address of the src you need, for example:

<script>
var callbackfunction = function (data) {
  Console.log (' I am a cross-domain request to the database--> ' + data.name);
</script>
<script src= "http://i2.mediapower.mobi/adpower/vm/Bora/js/test.js?callback= Callbackfunction "></script> 

Here I define a callbackfunction function, and then request data across the domain with the SRC attribute of the script tag, so the content of the test.js is agreed and needs to be written like this:
callbackfunction ({"Name": "Wwwwwwwwwwww"});
Save, open index.html and refresh:

(2) You can also dynamically add script tags to HTML parsing, dynamically load script scripts, and request remote data:

<script>
var callbackfunction = function (data) {
  Console.log (' I am a cross-domain request to the database--> ' + data.name);
var script = document.createelement (' script '), body
  = document.getElementsByTagName (' body ');

SCRIPT.SRC = ' http://i2.mediapower.mobi/adpower/vm/Bora/js/test.js?callback=callbackfunction ';
Body[0].appendchild (script);
</script>

The result is the same as above.

$.ajax in 2.jQuery ()

Imagine when you want to use jquery to request cross-domain data, such as (or just index.html):

<script src= "Js/jquery-1.11.3.js" ></script>
<script>
$ (function () {
  $.get (' http:// I2.mediapower.mobi/adpower/vm/bora/js/test.js ', function (data) {
    console.log (data)})
})
</script>

Browser or the relentless error, because you this URL is different under the domain name.

So now that jquery encapsulates the AJAX approach, why don't we use it, you don't need it, you're looking for sin, and the code is as follows:

<script src= "Js/jquery-1.11.3.js" ></script>
<script>
$ (function () {
  $.ajax ({
    Async:false,
    type: "Get",
    dataType: ' Jsonp ',
    jsonp: ' Callback ',
    jsonpcallback: ' Callbackfunction ',
    URL: "Http://i2.mediapower.mobi/adpower/vm/Bora/js/test.js",
    Data: "",
    timeout:3000,
    ContentType: "Application/json;utf-8",
    success:function (msg) {
      console.log (msg);
    }
  }
) </script>

When you make so many provocative work, the browser is very quick to give a response, that it is very cool, returned to you an object, which is the remote domain under different domains under the Test.js data.
3.postmessage+iframe

PostMessage is a new addition to HTML5, such as my local domain name, http://192.168.1.152:8080/webs/i.mediapower.mobi/wutao/testa.html testa.html:

<! DOCTYPE html>
 
 

At this point, the contents of my remote testb.html should be like this:

<! DOCTYPE html>
 
 

Save the code, open the local testa.html, access the remote testb.html

Summed up, jquery is very easy to use, basically JS capable things, jquery can be very fast and efficient completion, of course, the original JS can also solve a lot of things, and HTML5 new features are very powerful, these several methods, I was the most important jquery.

The above is for you to share 3 commonly used JS Cross-domain request data method, I hope to help you learn.