JavaScript uses window.name to solve cross-domain problems Page 1/2_javascript skills

window.name transmission technology was originally developed by Thomas Frank to solve some disadvantages of cookies (limit of 4 x 20 Kb per domain name, data can only be strings, Invented due to the complexity of setting and obtaining cookie syntax, etc.) (see the original text for details: 《Session variables without cookies》), and later Kris Zyp Based on this method, window.name transmission is enhanced and introduced to Dojo (dojox.io.windowName ), used to solve cross-domain data transmission problems. The basic principles and steps of
window.name transmission technology are:
name is an attribute of the global/window object in the browser environment, and when a new page is loaded in the frame, the attribute value of name remains unchanged. Change. By loading a resource within an iframe, the target page will set the frame's name attribute. This name attribute value can be obtained to access the information sent by the web service. But the name attribute is only accessible to frames with the same domain name. This means that in order to access the name attribute, when the remote web service page is loaded, the frame must be navigated back to the original domain. The same-origin policy still prevents other frames from accessing the name attribute. Once the name property is obtained, destroy the frame.

At the top level, the name attribute is unsafe, and any information set in the name attribute is available to all subsequent pages. However, the windowName module always loads resources in an iframe, and once the data is obtained, or when you browse a new page at the top level, the iframe will be destroyed, so other pages can never access the window.name property.

Basic implementation code, based on YUI, derived from the sample written by Ke Jun:

Copy code The code is as follows :

(function(){
var YUD = YAHOO.util.Dom, YUE = YAHOO.util.Event;

dataRequest = {
_doc: document ,
cfg: {
proxyUrl: 'proxy.html'
}
};

dataRequest.send = function(sUrl, fnCallBack){
if(!sUrl || typeof sUrl !== 'string'){
return;
}

sUrl = (sUrl.indexOf('?') > 0 ? '&' : '?') 'windowname=true';

var frame = this._doc.createElement('iframe'), state = 0, self = this;
this._doc.body.appendChild(frame);
frame.style.display = 'none';

var clear = function(){
try{
frame.contentWindow.document.write('');
frame.contentWindow .close();
self._doc.body.removeChild(frame);
}catch(e){}
};

var getData = function(){
try{
var da = frame.contentWindow.name;
}catch(e){}
clear();
if(fnCallBack && typeof fnCallBack === 'function'){
fnCallBack(da);
}
};

YUE.on(frame, 'load', function(){
if(state === 1){
getData();
} else if(state === 0){
state = 1;
frame.contentWindow.location = self.cfg.proxyUrl;
}
});

frame.src = sUrl;
};
})();