GraphQL playground - sending Cookie as Http Header "disappears"

11.2k views Asked by At

I'm testing some implementations in the GraphQL Playground, in which I want to send a specific cookie, so that I can fetch it in my resolver. I'm using the built in Http Headers pane in the playground:

enter image description here

However, when I add headers named either Cookie or cookie, it doesn't show up when I try to console.log it in my resolver. All other custom Http Headers show up with no issues.

enter image description here

As seen in the above screenshoot the testheader appears, but the cookie header doesn't. I'm using cookieParser, which might to blame for the cookie header disappearing, however I'm not sure. Here is a screenshot of my console.log section:

enter image description here

And when I try to console.log the req.cookies, I get nothing, which is to be one of the benefits of using the cookieParser.

enter image description here enter image description here

My ApolloServer implementation is as follows:

const server = new ApolloServer({
  typeDefs: schema
  resolvers,
  dataSources: () => ({
    // ...
  }),
  context: ({req, res}) => ({
    models,
    session: req.session,
    req,
    res
  }),
  // ... and the rest is not important
});

Creating a "custom" cookie header could do the trick, such as somecookie: <key>=<value>, but I don't think that's the best practice, and would prefer to avoid that. I'm hoping someone out there got an idea why my cookie header doesn't appear, or what I can do for it to appear?

1

There are 1 answers

2
Zeliax On BEST ANSWER

After extensive searching, documentation reading and etc. I figured out how I could make this work.

In the GraphQL playground settings (gear icon), located in the upper right corner of the window:

Gear icon in graphql playground

I changed the line "request.credentials" to "include" and SAVING the settings in the UI. Read more here. This line is taken directly from the documentation:

'request.credentials': 'omit', // possible values: 'omit', 'include', 'same-origin'

Then following that, I opened the developer tools window (usually F12), went to the tab Application. In here I simply added a cookie as seen in the screenshot. That cookie was sent together with my request.

Developer tools application tab