Cookies not being sent. about next-with-apollo HOT 9 CLOSED

To send cookies in the browser you need to use credentials.

To send cookies in SSR you need to send the cookies inside the headers of the request, there's no browser instance in SSR so credentials does nothing in this case.

Usage example:

import withApollo from 'next-with-apollo';
import ApolloClient from 'apollo-boost';

export default withApollo(
  ({ headers }) =>
    new ApolloClient({
      uri: process.API_URL,
      credentials: 'include',
      headers
    })
);

I'm going to close this issue now, if you keep having the issue, feel free to comment.

from next-with-apollo.

Well my problem is that headers are not visible in SSR on server. I know it should not be visible on the client side.

(A) Browser ---> (B) next SSR ---> (C) API

1. (A) Browser has a session (httpOnly cookie) with C
2. (A) It requests a page to be rendered by next SSR. Since B and C share domain and
   credentials option is set to 'include' the session cookie should follow right?
3. (B) During rendering some component renders an Apollo query. withApollo is run but headers prop is not injected in args.
4. (C) API request fails since it was not authorised and the cookie was not in the headers.

from next-with-apollo.

Ahh it's finally working 😅 .. my problem was this:

I imported ApolloClient like this:
import {ApolloClient} from 'apollo-boost'
instead of
import ApolloClient from 'apollo-boost'
using ApolloClient now gave error if I did not set link and cache options as well

So ApolloClient was created like this:

...
return new ApolloClient({
    link: new HttpLink({
        uri: `my-api-host/graphql`, 
        credentials: 'include', 
    }),
    cache: new InMemoryCache(),
    ssrMode: true,
    headers: headers
})

..credentials was put in HttpLink instead of ApolloClient. I think was the API for Apollo in a previous version.

Anyways thanks @lfades for having patience with me, this package is gold if you want apollo in combination with nextjs :)

from next-with-apollo.

Hi, I'm trying to get authentication with session cookie working with SSR. But for me headers in your example is undefined here. When replacing { headers } with props and logging it, it says:
{ initialState: {} }

My setup is according to the docs otherwise

Edit:
Hm ok missed this part in docs:

withApollo accepts a function that receives { ctx, headers } or { initialState } depending on whether it's running in SSR or not and returns an ApolloClient

however I've tried explicitly settings option getDataFromTree to 'ssr' and 'always' but I still don't get
{ ctx, headers } in my withApollo

from next-with-apollo.

@HeyHugo That's because it's not possible, for the browser always use the credentials option or manually create the headers. Sending the headers to the client will be a security issue, because headers may contain http only cookies or other sensitive information. Same thing with ctx, it contains SSR stuff that's never available in the browser, like access to the request and response.

from next-with-apollo.

@HeyHugo Maybe what you need is what I needed when I asked this question.

Are you trying to share credentials between the API and the NextJS page?

from next-with-apollo.

@lfades Hmm not sure I follow. The session cookie is a httpOnly coookie (since it's for a session).

The logging I did is on the nextjs server side not in the browser. Also if I log the req.headers in getInitialProps (server side still) I can see the session cookie that I want to "reuse".

Maybe what I'm trying to achieve is not possible without using a token based authentication without httpOnly cookie?

@serranoarevalo Yes sounds right. When my browser has an authenticated httpOnly session cookie I wan't that same cookie to be used by nextjs server when it's calling my API doing SSR.

from next-with-apollo.

@HeyHugo Yes, you can see the cookies in the headers during SSR, but in the browser that information is secret and it's treat in a different way, that's why we have credentials. In my example you can see that I'm sending the headers, which does the job of sending the cookies and other headers during SSR, then in the browser headers is undefined but now it's using credentials: include, which will send the cookies too.

from next-with-apollo.

@HeyHugo credentials does nothing in SSR because there is no browser instance.

from next-with-apollo.