Question

浏览器刷新有些时髦，我不太确定如何解决。因此，我已经能够在后端实现刷新令牌，这在操场上非常有用。我尚未为此设置的唯一功能是使旧令牌无效。我将令牌存储在运行登录突变时apollo客户端接收的cookie中（访问令牌和刷新令牌）。我用光了时间，一切似乎都正常了。我在每个页面上都有一个currentUser检查。由于查询是自动缓存的，因此通常只运行一次。

但是，当我刷新页面时，currentUser返回undefined。但。令牌仍在浏览器中！在cookie下，它确实会消失一秒钟，所以我不确定是否在没有令牌的情况下加载了apollo客户端，因此是新的Apollo实例吗？我想知道以前是否有人遇到过这个问题？

index.vue

<template>
  <div>
    <p v-if="$apollo.loading">Loading...</p>
    <h1 v-else>{{ me.firstname }}'s profile</h1>
  </div>
</template>

<script>
import { USER_QUERY } from "@/gql/graphql"

export default {
  data() {
    return {
      me: {}
    }
  },

  apollo: {
    me: {
      query: USER_QUERY
    }
  }
}
</script>

\ plugins \ apollo-client.js

import { InMemoryCache } from "apollo-cache-inmemory"
import { persistCache } from "apollo-cache-persist"

const cache = new InMemoryCache()

if (process.browser) {
  try {
    persistCache({
      cache,
      storage: window.localStorage
    })
  } catch (error) {
    console.error("Error restoring Apollo cache", error)
  }
}

export default function() {
  return {
    cache,
    httpEndpoint: "http://localhost:4000/graphql",
    httpLinkOptions: {
      credentials: "include"
    }
  }
}

nuxt.config中的Apollo配置

  apollo: {
    errorHandler(error) {
      console.log(error.message)
    },
    clientConfigs: {
      default: "~/plugins/apollo-client.js"
    }
  }

编辑：我不确定这到底是阿波罗问题还是Vue问题，任何帮助将不胜感激！

edit2：所以我发现刷新后apollo客户端没有传递cookie。所以我认为我的配置出了点问题。尽管有一些面包屑，

httpLinkOptions: {
      credentials: "include"
    }

如上所示，

在前端应足够，而在后端则应足够：

let corsOptions = {
  origin: 'http://localhost:3000',
  credentials: true
}

app.use(cors(corsOptions));

这应该足够了。但仍然遇到问题。

浏览器刷新导致apollo客户端停止将cookie发送到后端

0 个答案: