Nuxt Auth loggedIn 状态被缓存

Question

我在 Nuxt Auth loggedIn 状态方面遇到问题。我在通用模式下使用 Nuxt JS，我正在使用 Nuxt Auth 进行身份验证。

当用户注销时，$auth.loggedIn 状态会在该会话中正确解析。我在 $auth.logout() 期间没有重定向，但有条件语句可以解决所有注销状态需求。当用户在该会话中注销时，一切正常。

问题出现在我的 PWA 实例中，开始 url 转到： http://example.com/pwa 并且，从这里重定向 ($router.push(redirectPage)) 到 mounted() 之后的适当位置。旁注，我尝试重定向服务器端，但无法解决水合作用问题，因此这似乎是一个不错的选择。

在 logout() 之后，当 PWA 打开 start_url 时，$auth.loggedIn 显示 true，即使用户已注销。这与本地存储和 cookie 冲突，它们都显示错误的身份验证密钥。

当我在 Chrome 中对此进行调试并进行硬刷新时，它会将 $auth.loggedIn 适当地解析为 false。没有硬刷新，它会显示真实。

这似乎是某种缓存问题。此外，我正在使用 Nuxt PWA 模块。我不确定这是否是缓存 vuex 存储的服务工作者问题。

欢迎任何想法。

这是授权配置：

auth: {
        redirect: false,
        strategies: {
            local: false,
            password_grant: {
                scheme: 'local',
                token: {
                    property: 'access_token'
                },
                endpoints: {
                    login: {
                        url: '/oauth/token',
                        method: 'post',
                        propertyName: 'access_token'
                    },
                    logout: false,
                    user: {
                        url: 'api/auth/me',
                        method: 'get',
                        propertyName: 'user'
                    },
                }
            },
}

PWA 工作箱配置使用所有默认缓存值。

Answer 1

我想通了。 Nuxt PWA 模块将 start_url 添加到预缓存。也许这是允许离线 PWA 的要求。由于 start_url 被预缓存，因此它不会在记录 in/out 后更改状态。为了解决这个问题，每当我登录 in/out 时，我也会像这样刷新 start_url 预缓存条目：

//delete pre-cache start_url, then re-add, to refresh logged state
caches.open('cache-name').then(function(cache) {
  cache.keys().then( (arrayOfRequest) => {
    arrayOfRequest.forEach(function(request) {
      if (request.url.indexOf('start_url') !== -1) {
        cache.delete(request.url)
        cache.add(request.url)
      }
    })
  });
})

Nuxt Auth loggedIn 状态被缓存

Nuxt Auth loggedIn state getting cached

nuxt.js

progressive-web-apps

nuxt-auth