Vue.js spa认证|无法从本地存储中检索令牌？

Question

我的问题是我将@ websanova / vue-auth和vue-router packeges与laravel一起使用来编写spa（api身份验证系统）。用户登录后，他们应该重定向到另一条路由（不重新加载），并在localsorage中设置一个令牌。当我从本地存储中检索令牌时，在我的resources/bootstrap.js文件中，即使我在浏览器的检查器中检查了令牌的值，它也会返回“ null”。

这是我的bootstrap.js：

const token = localStorage.getItem('token')
 window.Echo = new Echo({
     broadcaster: 'pusher',
     key: 'ec356bcd******',
     cluster: 'ap2',
     encrypted: true,
     host: 'http://1227.0.0.1:8000',
     authEndpoint: 'api/broadcasting/auth',
     auth: {
        headers: {
          Authorization: 'Bearer ' + token
        },
      },
 });

所以

Authorization: 'Bearer ' + token 

返回：

Authorization: 'Bearer null'

但是，如果我刷新页面，则一切正常，但是由于我的应用程序是spa，因此用户不应该刷新页面