作者:携手相约幸福 | 来源:互联网 | 2023-09-24 10:01
0.缘起遇到一个跨域跳转,还要带上信息的问题。传统的localStorage\sessionStorage\Cookies显然无法满足我的需求了,所以另寻他法,找到一个window
0. 缘起
遇到一个跨域跳转,还要带上信息的问题。传统的localStorage\sessionStorage\COOKIEs显然无法满足我的需求了,所以另寻他法,找到一个window.name的方法挺好用的。
1. 同源
我的需求是A界面上点击表格某项跳转到对应的B界面,A界面会传值到B界面。AB非同源,顺便问一下,什么是同源?
同源策略,即同__协议__、域名、端口号,netscape浏览器规定如果有一个不满足就不允许访问另一个网页,如a.com和b.com就不是同源,那么a.com就不能得到b.com中的相关内容。
Javascript跨域总结与解决办法 - Rain Man - 博客园 (cnblogs.com)
2. window.name是什么
name 属性可设置或返回存放窗口的名称的一个字符串。
3. window.name怎么用
在不同源的情况下,之前用的三大金刚(l/s/c)就没法整(有别的方法,但是很麻烦)。我这里选择了本地跳转页面,依旧能拿到上个页面信息的方法。
// A page
window.name='str'
// B page
console.log(window.name) // 'str'
4. window家族
window
对象表示一个包含DOM文档的窗口,其 document
属性指向窗口中载入的 DOM文档 。使用 document.defaultView
属性可以获取指定文档所在窗口。
window
作为全局变量,代表了脚本正在运行的窗口,暴露给 Javascript 代码。
Window - Web API 接口参考 | MDN (mozilla.org)
4.1 Window.location
获取、设置 window 对象的 location, 或者当前的 URL.
// redirect to Url site
window.location.href = Url;
4.2 Window.open
Window
接口的 open()
方法,是用指定的名称将指定的资源加载到浏览器上下文(窗口 window
,内嵌框架 iframe
或者标签 tab
)。如果没有指定名称,则一个新的窗口会被打开并且指定的资源会被加载进这个窗口的浏览器上下文中。
Window.open() - Web API 接口参考 | MDN (mozilla.org)
附录
前端跨域整理 - 掘金 (juejin.cn)
Window.name - Web API 接口参考 | MDN (mozilla.org)
人生到处知何似,应似飞鸿踏雪泥。