Javascript 如何在NextJS应用程序中从Apollo链接上下文访问Express HTTP请求?
我正在构建一个Javascript 如何在NextJS应用程序中从Apollo链接上下文访问Express HTTP请求?,javascript,express,next.js,apollo-client,Javascript,Express,Next.js,Apollo Client,我正在构建一个NextJS应用程序,我正在尝试访问一个cookie,这样我就可以用它为GraphQL请求设置Http头,我正在使用apollo链接上下文。这是创建Apollo客户端的代码 function createApolloClient(initialState = {}) { const httpLink = new HttpLink({ uri: `${baseUrl}/graphql`, credentials: 'same-origin', fetch }) const
NextJS
应用程序,我正在尝试访问一个cookie
,这样我就可以用它为GraphQL请求设置Http头
,我正在使用apollo链接上下文
。这是创建Apollo客户端的代码
function createApolloClient(initialState = {}) {
const httpLink = new HttpLink({ uri: `${baseUrl}/graphql`, credentials: 'same-origin', fetch })
const authLink = setContext((_, prevCtx) => {
let token = ''
if (typeof window === 'undefined') token = getCookieFromServer(authCookieName, REQ)
else token = getCookieFromBrowser(authCookieName)
return ({ headers: { 'Auth-Token': token } })
})
const client = new ApolloClient({
ssrMode: typeof window === 'undefined',
cache: new InMemoryCache().restore(initialState),
link: authLink.concat(httpLink)
})
return client
}
这里的问题是,getCookieFromServer
函数需要一个Express请求
作为第二个参数,因此它可以从req.headers.cookie
中提取cookie,我不知道从哪里可以得到它。我终于找到了一种方法。每当我从服务器发送请求时(在PageComponent.getInitialProps
中),我都会在上下文中设置头,然后我可以从setContext
访问它:
PageComponent.getInitialProps = async (ctx) => {
...
const token = getCookieFromServer(authCookieName, ctx.req)
const { data } = await client.query({
query,
context: { headers: { 'Auth-Token': token } }
})
...
}
然后在setContext中:
const authLink = setContext((_, prevCtx) => {
let headers = prevCtx.headers || {}
if (!headers['Auth-Token']) {
const token = getCookieFromBrowser(authCookieName)
headers = { ...headers, 'Auth-Token': token }
}
return ({ headers })
})
因此,如果头已经存在于前面的上下文中(从服务器发送时就是这种情况),只需使用它即可。如果cookie不存在(从浏览器发送时),请从浏览器获取cookie并进行设置
我希望有一天它能帮助别人