fetch: Getting cookies from fetch response
<p>I'm trying to implement client login using fetch on react. </p>

<p>I'm using passport for authentication. The reason I'm using <code>fetch</code> and not regular <code>form.submit()</code>, is because I want to be able to recieve error messages from my express server, like: <code>"username or password is wrong"</code>.  </p>

<p>I know that passport can send back messages using <code>flash</code> messages, but <code>flash</code> requires sessions and I would like to avoid them.</p>

<p>This is my code:</p>

<pre><code>fetch('/login/local', {
      method: 'POST',
      headers: {
        Accept: 'application/json',
        'Content-Type': 'application/json',
      },
      body: JSON.stringify({
        username: this.state.username,
        password: this.state.password,
      }),
    }).then(res =&gt; {
      console.log(res.headers.get('set-cookie')); // undefined
      console.log(document.cookie); // nope
      return res.json();
    }).then(json =&gt; {
      if (json.success) {
        this.setState({ error: '' });
        this.context.router.push(json.redirect);
      }
      else {
        this.setState({ error: json.error });
      }
    });
</code></pre>

<p>The server sends the cookies just fine, as you can see on chrome's dev tools:
<a href="https://i.stack.imgur.com/W8UxQ.png" rel="noreferrer"><img src="https://i.stack.imgur.com/W8UxQ.png" alt="Network - Cookies"></a>
<a href="https://i.stack.imgur.com/526e8.png" rel="noreferrer"><img src="https://i.stack.imgur.com/526e8.png" alt="Network - Headers"></a></p>

<p>But chrome doesn't set the cookies, in Application -> Cookies -> localhost:8080: "The site has no cookies".</p>

<p>Any idea how to make it work?</p>