0. 前言
相信跨域有什么手段,大家都背得滚瓜烂熟了。现在我们来做一些不在同一个tab页面或者跨域的实践。
1. localstorage
1.1 onstorage事件
localstorage是浏览器同域标签共用的存储空间,所以可以用来实现多标签之间的通信。html5出现了一个事件: onstorage,我们在window对象上添加监听就可以监听到变化: window.addEventListener(‘storage’, (e) => console.log(e))
需要注意,此事件是非当前页面对localStorage进行修改时才会触发,当前页面修改localStorage不会触发监听函数。如果实在是要,自己重写一个方法吧,要不就在修改的时候把自己改的内容po上去。
示例: js:
if(!localStorage.getItem('a')){
localStorage.setItem('a',1)
}else{
var s = localStorage.getItem('a')
localStorage.setItem('a',+s+1)
}
window.addEventListener('storage', (e) => console.log(e))