今天小编跟大家讲解下有关window.name解决跨域数据传输问题 ,相信小伙伴们对这个话题应该有所关注吧,小编也收集到了有关window.name解决跨域数据传输问题 的相关资料,希望小伙伴们看了有所帮助。
原文:http://research.microsoft.com/~helenw/papers/subspace.pdfwindow.name 传输技术 原本是 Thomas Frank 用于解决 cookie 的一些劣势(每个域名 4 x 20 Kb 的限制、数据只能是字符串、设置和获取 cookie 语法的复杂等等)而发明的(详细见原文:《Session variables without cookies》) 后来 Kris Zyp 在此方法的基础上强化了 window.name 传输 并引入到了 Dojo (dojox.io.windowName) 用来解决跨域数据传输问题。window.name 的美妙之处:name 值在不同的页面(甚至不同域名)加载后依旧存在 并且可以支持非常长的 name 值(2MB)。window.name 传输技术的基本原理和步骤为:name 在浏览器环境中是一个全局/window对象的属性 且当在 frame 中加载新页面时 name 的属性值依旧保持不变。通过在 iframe 中加载一个资源 该目标页面将设置 frame 的 name 属性。此 name 属性值可被获取到 以访问 Web 服务发送的信息。但 name 属性仅对相同域名的 frame 可访问。这意味着为了访问 name 属性 当远程 Web 服务页面被加载后 必须导航 frame 回到原始域。同源策略依旧防止其他 frame 访问 name 属性。一旦 name 属性获得 销毁 frame 。在最顶层 name 属性是不安全的 对于所有后续页面 设置在 name 属性中的任何信息都是可获得的。然而 windowName 模块总是在一个 iframe 中加载资源 并且一旦获取到数据 或者当你在最顶层浏览了一个新页面 这个 iframe 将被销毁 所以其他页面永远访问不到 window.name 属性。基本实现代码 基于 YUI 源自 克军写的样例:(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; };})();来源:爱蒂网