Javascript 下一个Apollo客户端不发送cookie

因此，我有一个运行在

localhost:5000

的Express/TypeGraphql后端和运行在

localhost:3000

的Next/React应用程序。我决定使用apollo服务器作为GraphQLAPI，使用apollo客户端作为前端。成功登录后，我将httpOnly cookies存储在web浏览器中

我想做的是，在每个请求中获取cookie，并在oauth2令牌有效的情况下授权用户。即使请求是有效的，并且我得到了查询，cookie也显示为null。而且，我在控制台中没有发现错误

在这里我保存cookies=>

服务器.ts 在这里，我在请求=>

分解器 最后，这是我的apollo客户端配置=>

阿波罗客户端 每次请求后，我的控制台都会显示

cookies:[Object:null-prototype]{}

，即使我在浏览器的cookie存储中看到它们

request.ts

---

}我想您还没有完全理解Next.js。js在服务器上呈现视图，或者向客户端发送“服务器端道具”。这意味着

getServerSideProps

将在服务器上执行（顾名思义）。Cookie是浏览器的一项功能。那么会发生什么呢

浏览器将请求发送到Next.js。如果Next.js服务器和GraphQL服务器位于同一个域上，则请求包含Cookie头

Next.js接收请求并执行

getServeSideProps

Next.js Apollo Client向服务器发出请求，但缺少cookies，因为cookies仅在浏览器的初始请求中 这意味着您必须首先确保Next.js服务器从前端接收cookie。如果它与GraphQL服务器位于同一个源上，则应该自动执行此操作。否则会有点棘手，在这种情况下，使用显式授权头应该更容易。然后，您必须将cookies与请求一起传递。这可以通过访问

getServerSiteProps

中的

req

并使用中的来完成

导出异步函数getServerSideProps（上下文）{
const Cookie=context.req.headers.Cookie；
const{data}=wait client.query({
上下文：{headers:{Cookie}}，
查询：gql`
查询诱惑者{
使用者{
身份证件
用户名
}
}
`,
});
返回{
道具：{
用户：data.users，
},
};
}

---

代码未经测试，但我想您已经明白了。

您是否在后端发出GraphQL请求，例如服务器端渲染某些视图？我认为您必须将cookies转发到GraphQL后端。也许能帮上忙？我编辑了这个问题。我这样做我的请求，它也应该自动发送cookies在我的每一个请求后端。我想我不需要一个包裹。

app.get('/auth/google/callback', function (req, res, next) {
    passport.authenticate('google', { session: false }, (err, user, info) => {
        if (err) return next(err);
        if (!user) return res.redirect('/');
        res.cookie('login_cookie', JSON.stringify(info), {
            secure: false,
            httpOnly: true,
            expires: dayjs().add(30, 'days').toDate(),
            sameSite: false,
        });
        return res.redirect('http://localhost:3000/home');
    })(req, res, next);
});

@Query(() => [User])
async users(@Ctx() ctx: Context) {
    console.log('cookies ', ctx.req.cookies);
    return await ctx.prisma.user.findMany();
}

const client = new ApolloClient({
  cache: new InMemoryCache(),
  credentials: "include",
  uri: "http://localhost:5000/graphql",
});

export async function getServerSideProps() {
const { data } = await client.query({
  query: gql`
    query allUsers {
      users {
        id
        username
      }
    }
  `,
});

return {
  props: {
    users: data.users,
  },
};