Home PC Games Linux Windows Database Network Programming Server Mobile  
           
  Home \ Programming \ Use window.name + iframe cross-domain access to data Detailed     - CentOS 6.5 upgrade to CentOS 7 (Linux)

- Stucts2 values on the page and how the attribute values corresponding to the Action (Programming)

- Linux common network tools: batch scanning of hosting services netcat (Linux)

- The basic principles for the protection of a good linux server security (Linux)

- Axel install plug under CentOS 5/6 acceleration yum downloads (Linux)

- Linux user login and IP restrictions (Linux)

- To install and deploy Apache under the CentOS (Server)

- Use libpq under Ubuntu 14.04 (Linux)

- To disable the function by pressing Ctrl-Alt-Del to restart the system in RHEL / CentOS 5/6 (Linux)

- Nginx configuration support f4v video format player (Server)

- Linux source code analysis tool (Linux)

- 17 How to install the Ubuntu 14.04 and Linux Mint Kodi14 (XBMC) (Linux)

- Linux --- process handle limit summary (Linux)

- RT-11SJ run at ambient PDP-11 MACRO-11 assembly (Programming)

- 12 kinds of detection of CPU information on a Linux system tools (Linux)

- Source MongoDB 3.2.1 installed on CentOS6.5 (Database)

- Install Unity 8 preview version of the desktop in Ubuntu (Linux)

- Java, hashcode, equals and == (Programming)

- Vim Getting Started Tutorial (Linux)

- Oracle 12C RAC optimizer_adaptive_features cause of data into overtime (Database)

 
         
  Use window.name + iframe cross-domain access to data Detailed
     
  Add Date : 2017-04-13      
         
         
         
  Detailed

Previously mentioned with jsonp way to get cross-domain data, the next article, we will introduce how to use window.name + iframe cross-domain access to data.

First, we must understand the simple knowledge under window.name and the iframe. iframe html tag is, you can create a web page inline frames, there is a src attribute (address points to a file, html, php, etc.) you can select content inline frames, you can look at an example (Mengchuo here), probably know next on the list. Value window.name (usually in js code appear) is not an ordinary global variable, but the name of the current window to note here is that each package has its iframe's window, and this window is the top window of the child window, but it also has window.name natural attributes, magic window.name property values in that name after different pages (or even different domains) load is still there (if you do not modify the value does not change), and can support a very long name value (2MB).

Cross-domain solution seems to be ready to come out, assuming index.html page request to the remote server data, we create a iframe tag in the page, the iframe src attribute points to a file server address (the ability to use cross-domain iframe tag), server document set window.name value (that is, the name of the iframe contentWindow value), and then read the value of the iframe window.name in index.html, everything seemed to fall into place, as follows:

< Body>
  < Script type = "text / javascript">
    iframe = document.createElement ( 'iframe'),
    iframe.src = 'http: // localhost: 8080 / data.php';
    document.body.appendChild (iframe);
    iframe.onload = function () {
      console.log (iframe.contentWindow.name)
    };
  < / Script>
< / Body>

< ? Php
  echo '< script> window.name = "{\" name \ ": \" hanzichi \ ", \" age \ ": 10}"; < / script>'
?>

What prompted protocol, host, port, three to be consistent, it is not a cross-border naked tell you what! Why this is so, it is stipulated that if the index.html page and this page and in the iframe src framework if a different source, you can not be anything in the framework of the operation, so they take less than iframe name value framework, and you tell us not one, you can never expect to get my data here. As to origin, it refers to another src, I said earlier, no matter how loaded window.name value will not change, so we index.html in the same directory, create a proxy.html empty page, modify the code as follows :

Copy the code
< Body>
  < Script type = "text / javascript">
    iframe = document.createElement ( 'iframe'),
    iframe.src = 'http: // localhost: 8080 / data.php';
    document.body.appendChild (iframe);
    iframe.onload = function () {
      iframe.src = 'http: // localhost: 81 / cross-domain / proxy.html';
      console.log (iframe.contentWindow.name)
    };
  < / Script>
< / Body>
Ideal seems very good, in the iframe loaded, rapid reset iframe.src point, and make the index.html homologous, then the index page will be able to get the value of its name! But the reality is cruel, iframe performance is in reality has been constantly refreshed, well understood, after each time the trigger onload reset src, equivalent to reload the page, and trigger onload event, so do not He stopped to refresh (but can still required data output). After modifying the code as follows:

< Body>
  < Script type = "text / javascript">
    iframe = document.createElement ( 'iframe');
    iframe.style.display = 'none';
    var state = 0;
    
    iframe.onload = function () {
      if (state === 1) {
          var data = JSON.parse (iframe.contentWindow.name);
          console.log (data);
          iframe.contentWindow.document.write ( '');
          iframe.contentWindow.close ();
        document.body.removeChild (iframe);
      } Else if (state === 0) {
          state = 1;
          iframe.contentWindow.location = 'http: // localhost: 81 / cross-domain / proxy.html';
      }
    };

    iframe.src = 'http: // localhost: 8080 / data.php';
    document.body.appendChild (iframe);
  < / Script>
< / Body>
to sum up

Cross-domain can be used in this way, there are several conditions is essential.

The ability to cross-domain iframe tag
Ability window.name property value in the document after refresh still exist
Be easier to understand some of the knowledge and under the window of contentWindow. The browser will create a window object for the original document, and then (iframe) to create an extra window object for each frame. These additional object is a child window of the original window, which may be affected by events of the original window. For example, close the original window will lead to close all child windows. contentWindow property refers to the specified frame or iframe where the window object.

Instructions

Many people may focus only use methods and principles very cold. This law in regard jsonp complicated, but also more complicated to use.

Usually the server output some js code, so the following example:

< ? Php
  echo '< script> window.name = "{\" name \ ": \" hanzichi \ ", \" age \ ": 10}"; < / script>'
?>
Window.name value is a string, but also need to pass the data to the client (of course, if there is need for the server to be processed first pass over the data, only the data here only return), there is a need to go myself to resolve (eg string -> json data).

index.html page, I became a function of the method of packaging:

< Body>
  < Script type = "text / javascript">
    function crossDomain (url, fn) {
      iframe = document.createElement ( 'iframe');
      iframe.style.display = 'none';
      var state = 0;
    
      iframe.onload = function () {
        if (state === 1) {
          fn (iframe.contentWindow.name);
          iframe.contentWindow.document.write ( '');
          iframe.contentWindow.close ();
          document.body.removeChild (iframe);
        } Else if (state === 0) {
          state = 1;
          iframe.contentWindow.location = 'http: // localhost: 81 / cross-domain / proxy.html';
        }
      };

      iframe.src = url;
      document.body.appendChild (iframe);
    }
    
    // transfer
    // server address
    var url = 'http: // localhost: 8080 / data.php';
    crossDomain (url, function (data) {// process data is window.name data value (string)
      var data = JSON.parse (iframe.contentWindow.name);
      console.log (data);
    });
  < / Script>
< / Body>
There is also a small problem, ie compatible (under the iframe onload ie use seems attachEvent, and json for ie compatible), friends who are interested to study the own (you can refer to the reference article); additional proxy agent can page without this document, it will report 404 but does not affect the functionality (but the path must be homologous and index page).

Another point worth considering is when the iframe src redirect code:

iframe.contentWindow.location = 'http: // localhost: 81 / cross-domain / proxy.html';
Then iframe.src point or server page, the code here if iframe.src = 'http: // localhost: 81 / cross-domain / proxy.html'; instead of also can output results, clever you know difference?
     
         
         
         
  More:      
 
- Installation image conversion tool on your Ubuntu Converseen 0.8.1 (Linux)
- RedHat Linux 6.4 installation RTL8188CUS wireless network card driver (Linux)
- VMware virtual machine can not start VMnet0 no Internet access and other issues (Linux)
- Five useful commands to manage file types and system time in linux (Linux)
- Enterprise Hadoop cluster architecture - DNS installation (Server)
- Alien Magic: RPM and DEB Mutual Convert (Linux)
- Multipath configuration under Linux (Linux)
- Oracle 11g new features of the collection of multi-column statistics (Database)
- Ubuntu 12.04 / 14.04 users to install software LyX document processing (Linux)
- Ordinary users how to use the firewall software (Linux)
- How to install Git on CentOS 7 (Linux)
- Debian users to install FFmpeg 2.2.2 (Linux)
- How to install Ubuntu strategy game Wesnoth 1.12.0 (Linux)
- Ubuntu: HDF5 error: HDF5 header version does not match with the HDF5 library (Linux)
- Linux configuration startup mount: fstab file (Linux)
- How the program is executed (Programming)
- Generated characters using Java Videos (Programming)
- Oracle in the add & split partition on the impact of global & local index (Database)
- wget command Walkthrough (Linux)
- Java memory area and memory overflow exception (Programming)
     
           
     
  CopyRight 2002-2022 newfreesoft.com, All Rights Reserved.