记一次前端bug排查

现象

这周刚加入了一个后台管理系统项目，测试反馈系统刷新时经常会直接登出，严词要求解决这个“重大”bug，so尴尬。
更严重的是发现系统在IE上直接登不进去，婶可忍叔不可忍，于是我开启了苦逼的寻bug之路。

第一次尝试

既然是登出了，当然会有登出请求，chrome刷新页面，查看network，看到页面刷新时有三个请求，返回结果显示

{"errorCode":401,"errorMsg": "401 Unauthorized."}

,ԾㅂԾ,接着查看接口数据处理

if (status === 401) {
    // @HACK
    /* eslint-disable no-underscore-dangle */
    window.g_app._store.dispatch({
        type: 'login/logout',
    });
    return;
}

原来接口返回401时，登出系统。
难道接口发你会出错了？？？

第二次尝试

经与后台沟通，了解到返回401表明接口请求时没有携带token，好像里胜利又近了一步。

查看代码，整个系统只在request.js文件中有操作token的代码，读源码发现这就是fetch的二次封装文件啊，那就好办，跟踪请求，查看日志，毫不费力。

token存在cookie里,cookie的操作代码都在token.js文件里。

export function getCookieValueByKey (key) {
  const cookies = document.cookie.split('; '); // 解析出名/值对列表

  for(let i = 0; i < cookies.length; i+=1) {
    const arr = cookies[i].split('='); // 解析出名和值
    if(arr[0] === key) {
      return arr[1]; // 对cookie值解码
    }
  }
  return '';
}

export function deleteCookieByKey (key) {
  document.cookie = `${key}=; expires=Thu, 01 Jan 1970 00:00:00 GMT`;
}

export function setValueCookie (key, value) {
  const date = new Date();
  const expireDays = 1;
  // 将date设置为1天以后的时间
  date.setTime(date.getTime() + expireDays * 24 * 3600 * 1000)
  document.cookie = `${key}=${value};expires=${date.toGMTString()}`;
}

代码这么基础，还有注释，
果断打上日志，清除浏览器缓存
，登陆系统

查询了cookie false
token.js:25 设置了cookie true
token.js:25 设置了cookie true
token.js:25 设置了cookie true
token.js:25 设置了cookie true
token.js:2 查询了cookie true
token.js:2 查询了cookie true
token.js:2 查询了cookie true

ennn

F5刷新，没有复现

F5

F5

清缓存，再F5

F5

终于等到了！！！

token.js:2 查询了cookie false
token.js:2 查询了cookie false
token.js:2 查询了cookie false
token.js:15 删除了cookie false
token.js:15 删除了cookie false
token.js:15 删除了cookie false
token.js:15 删除了cookie false
token.js:2 查询了cookie false
token.js:2 查询了cookie false
token.js:15 删除了cookie false
token.js:15 删除了cookie false
token.js:15 删除了cookie false
token.js:15 删除了cookie false
token.js:2 查询了cookie false

emmm

查询发现cookie没了？
代码没有删cookie的操作

第三次尝试

经过百度，咨询都没能找到答案，就在我打算死马当活马医重新写一遍cookie读写时，查看浏览器发现每次切页面涮新时cookie的Path都不相同。

抱着试一试的态度，设置cookie存储路径

document.cookie = `${key}=${value};expires=${date.toGMTString()}; path=/`;

尝试发现Bug不能复现，打开IE登陆正常。至此问题算是得到了解决。???