JS cross-domain XML--with AS URLLoader

JS cross-domain XML--with AS URLLoader
Recently, I received a requirement for function expansion. However, the data interface referenced in the new requirement can only be provided in XML format. Unfortunately, my own skills are limited and I couldn’t think of an ideal solution in JS. I had to seek help from AS engineers. After nearly 2 days of joint debugging, I finally solved the cross-domain access under various browsers.
The demo version code is recorded below:
Parent page HTML:

Copy code
The code is as follows:

<iframe id="hiddenIframe" style="width:0px; height:0px0; border:0px none; *width:1px; *height:0px; overflow:hidden;"></iframe>
<button value="Get data" onclick="getData()"></button>
<!-- Why not directly use display:none; or visibility: hidden;? [Explain later: tag] -->

Parent page JS:

Copy code
The code is as follows:

document.domain = "xxx.com";
function getData(data) {
if (data == "" || data == undefined || data == null) {
sendData("a=1&b=2"); //The parameter format is arbitrary, equivalent to the parameters you send when making a get request
}
else {
alert("Acquired data: " + data)
} }
function sendData(param) {
var childWindow = document.getElementById('testIframe').contentWindow;
childWindow.sendData(param); // Driving function, driving the method in the hidden domain to call the API method in AS to obtain XML
}
function change() {
document.getElementById("testIframe").src = "xx.html"; //Hidden domain URL
}

Subpage JS:

Copy code
The code is as follows:

document.domain = "xxx.com";
function sendData(paramFromParent) {
var serverUrl = 'xxx.com';
//Here, paramFromParent is processed to obtain the complete URL of xxx.xml
//Then call AS's URLLoader method to get the data under the URL
//After successful acquisition, call the following method to drive the getData method in the parent page
}
function getData(backData) {
window.parent.getData(backData);
}

Tag: The reason why display or visibility is not used is that in IE browser, when your iframe element is styled as these two points, the JS in the frame is not loaded, and communication cannot be performed...
For easy understanding, the picture above speaks for itself

Program flow:
1. Load JS and declare the sendData and getData methods under the parent page window
2. Load iframe
3. Run the AS code in the iframe
4. AS cross-domain acquisition xml file parsing and processing
5. Call window.parent.getData to drive the parent page JS and pass the parsed data

<<:  Summary of the style modification of the input box of type="file"

>>:  CSS solves the misalignment problem of inline-block

Recommend

Summary of the differences between get and post requests in Vue

The operating environment of this tutorial: Windo...

Detailed explanation of Vue development website SEO optimization method

Because the data binding mechanism of Vue and oth...

Detailed explanation of JS variable storage deep copy and shallow copy

Table of contents Variable type and storage space...

js to achieve the effect of light switch

This article example shares the specific code of ...

Optimized record of using IN data volume in Mysql

The MySQL version number is 5.7.28. Table A has 3...

Complete steps to install FFmpeg in CentOS server

Preface The server system environment is: CentOS ...

Mobile browser Viewport parameters (web front-end design)

Mobile browsers place web pages in a virtual "...

js and jquery to achieve tab status bar switching effect

Today we will make a simple case, using js and jq...

Implementation steps of encapsulating components based on React

Table of contents Preface How does antd encapsula...

Some common mistakes with MySQL null

According to null-values, the value of null in My...

Detailed explanation of slots in Vue

The reuse of code in vue provides us with mixnis....

How to modify iTunes backup path under Windows

0. Preparation: • Close iTunes • Kill the service...

Detailed explanation of various loop speed tests in JS that you don’t know

Table of contents Preface 1. for loop 2. while lo...

A detailed discussion of MySQL deadlock and logs

Recently, several data anomalies have occurred in...

Tutorial on installing AutoFs mount service under Linux

Whether it is Samba service or NFS service, the m...