Using script src to implement _javascript techniques for Cross-domain and similar Ajax effects

Scene

If there are two different domains of servers, a.com and B.Com, in the b.com/b_return_js.php interface, you can get some data. Of course, if it is a B.Com page, you can use Ajax to directly request this interface, but if you are requesting it on the A.com page.

B_return_js.php Interface Code:

Copy Code code as follows:

$a = Array (
Array (' username ' => ' Tony ', ' age ' =>25),
Array (' username ' => ' yimeng ', ' age ' =>23),
Array (' username ' => ' ermeng ', ' age ' =>22),
Array (' username ' => ' sanmeng ', ' age ' =>21),
);
Shuffle ($a);

Echo ' var userdata = '. Json_encode ($a). '; In general, if it is b.com request directly back to Json_encode ($a), but if you want to use the SRC attribute cross-domain, here we need to assign this value to a JS variable, to ensure that the script tag after the loading of the page to get the data and use.

Simple implementation

An easy way to do this is to a.com the page directly

Copy Code code as follows:

<script src= "http://b.com/b_return_js.php" ></script>

This allows you to get directly to the data returned from this interface in the A.com page.
But there is a flaw, this data can only be obtained when the page is loaded, if we want to use Ajax that can get the new interface data at any time is not very applicable, such as clicking a button, from this interface to get data local refresh, this way there are some inappropriate.

Class AJAX implementation

In fact, the idea of the class Ajax described above is to regenerate the label on the top of the Ajax condition when it is triggered, and then get the data from the interface again, but actually it's a little difficult to achieve (at least for me).

Code on:

If there is a button under the a.com/scriptsrc.php page

<input type= "button" id= "Ajax_request_from_b" value= "request from B.Com"/>
Each click will get the data from the B.com/b_return_js.php interface, similar to the AJAX implementation code:

Copy Code code as follows:

function Createscript ()
{
Console.log (ele);
ELE.SRC = ' http://b.com/b_return_js.php ';
Ele.type = ' Text/javascript ';
Ele.language = ' JavaScript ';
}

function GetData ()
{
Console.log (UserData);
}

$ (' #ajax_request_from_b '). Click (function () {

The script tag needs to be reloaded each time, so a new script tag is regenerated each time to secure data from a Cross-domain server
if (ele && ele.parentnode)
{
Ele.parentNode.removeChild (ele); This deletion does not remove the ele from memory completely, except in the position in the DOM
For (Var property in Ele) {
Delete Ele[property]; Completely removed
}
}
Ele = document.createelement (' script '); This is a new ele.
Createscript ();
document.getElementsByTagName ("Head") [0].appendchild (Ele);
Ele.onload = function () {getData ()}; The script element can be loaded before it gets userdata, and each fetch is a random order of user information
});

So every time you click the button, will be again from the interface to get the data again, the effect is similar to Ajax, but this is a JS Cross-domain method to achieve, although some thankless, but it is a way of thinking.