SSR apollo link http not passing authentication cookies
March 24, 2019 at 11:44amSSR apollo link http not passing authentication cookies
March 24, 2019 at 11:44amI have a nextjs app running on
localhost:3000
and a graphql server running at localhost:8000
. I have a login mutation that is writing a cookie to the response.res.cookie("authentication", token, {httpOnly: true,maxAge: 1000 * 60 * 60 * 24 * 1});
On the nextjs end I am setting up the apollo client as follows
return new ApolloClient({connectToDevTools: process.browser,ssrMode: !process.browser,link: createHttpLink({uri: 'http://localhost:8000/graphql',credentials: 'include'}),cache: new InMemoryCache().restore(initialState || {}),})
With this setup the authentication cookie is sent with requests to graphql but only when using clientside navigation. If I render a route directly from the server the cookie is not sent with the graphql request and I can therefore not determine whether the user is logged in or not.
I have managed to get this to work by including a
customFetch
implementation in the options for createHttpLink
which internally takes the cookie header from the server side request and passes it through to the fetch.return new ApolloClient({connectToDevTools: process.browser,ssrMode: !process.browser,link: createHttpLink({fetch: customFetch(headers),uri: 'http://localhost:8000/graphql',credentials: 'include'}),cache: new InMemoryCache().restore(initialState || {}),})
const customFetch = headers => (uri, options) => {options.headers.cookie = headers.cookiereturn fetch(uri, options);
Is this the correct way of getting this to work? It does strike me as probably not.
August 7, 2019 at 1:52pm
have you fixed this?
August 12, 2019 at 10:31am
August 12, 2019 at 7:47pm
can you not get the cookies to pass to the back-end on every request? Or are you worried about the security issue like OP above? If it's the former, just follow [this example] (https://github.com/zeit/next.js/tree/master/examples/with-apollo) and use
[email protected]
, [email protected]
, and import { getDataFromTree } from '
/react-ssr'
. If you get stuck check out my implementation [here] (https://github.com/NinjaOnRails/apollo-nextjs)August 13, 2019 at 9:58pm
I've fixed it for myself using the latest libraries [email protected], [email protected] and [email protected] Cookies are passed with every request, SSR working as expected and no errors. Code is here
August 14, 2019 at 7:29am
I didn't use the custom fetch option I detailed originally in the end. I
concat
'd another link to the httpLink that added the cookie headers to the request. So I guess similar approach but different.return new ApolloClient({connectToDevTools: process.browser,ssrMode: !process.browser, // Disables forceFetch on the server (so queries are only run once)link: customLinkLink.concat(httpLink),cache: new InMemoryCache().restore(initialState || {})})
I'll check out your code to see if I can get rid of that logic too! Thanks!
December 19, 2020 at 7:13am