js通过token检测是否存在，是否登陆，更改状态

浏览器中打开了多个页面的情况下，登陆状态过期了，过期自动情况缓存本地的token，js定时器检测是否存在token

（前提是做好token过期自动清理本地缓存的token）

不需要刷新页面的情况下也可以做到浏览器多开的页面头部登陆状态自动改变

image.png image.png

let requestState = false  //  登录状态
setInterval(() => {
    //  如果本地存在token则不请求登录状态 
    //  如果本地token不存在
    if(localStorage.getItem('tokens')  || localStorage.getItem('userLoginInfo')) {
        if (requestState) {
            makeHead()  //  检测是否登陆 改变头部的 html
            requestState = false
        }
    } else {
        requestState = true
        makeHead()  //  检测是否登陆 改变头部的 html
    }
}, 10000);

显示登陆状态

//  显示登陆状态
function makeHead() {
    ajax.get(`checkLogin`,res => {
        if (res.state) {  //  已登录
            document.querySelector(`#header`).innerHTML = `
                <div style="dispaly:flex;">
                    <div>超级商家</div>
                    <div>我的金币999999</div>
                    <div>立即充值</div>
                    <div>个人中心</div>
                    <div>消息</div>
                </div>
            `
        } else {
            document.querySelector(`#header`).innerHTML = `
                <div style="dispaly:flex;">
                    <div>登陆</div>
                    <div>注册</div>
                </div>
            `
        }
    })
}