title: Cookies disappear after redirect
body: <p>I have:</p>
  
  <p>1) A client side app that has its own domain: <a href="http://client.com" rel="nofollow noreferrer">http://client.com</a></p>
  
  <p>2) A server side app that has a separate domain: <a href="http://server.com" rel="nofollow noreferrer">http://server.com</a></p>
  
  <p>Now,</p>
  
  <p>the scenario is:</p>
  
  <p>1) Opening <a href="http://client.com/home" rel="nofollow noreferrer">http://client.com/home</a> in the browser, which displays an HTML page.</p>
  
  <p>2) <a href="http://client.com/home" rel="nofollow noreferrer">http://client.com/home</a> redirects to <a href="http://server.com/login" rel="nofollow noreferrer">http://server.com/login</a></p>
  
  <p>3) <a href="http://server.com/login" rel="nofollow noreferrer">http://server.com/login</a> stores a cookie 'auth' and sends a redirect instruction to <a href="http://client.com/welcome" rel="nofollow noreferrer">http://client.com/welcome</a></p>
  
  <p>Response:</p>
  
  <blockquote>
    <p>Access-Control-Allow-Origin: *</p>
    
    <p>Connection: keep-alive</p>
    
    <p>Content-Length: 104</p>
    
    <p>Content-Type: text/html; charset=utf-8</p>
    
    <p>Date: Wed, 16 Jan 2019 10:47:11 GMT</p>
    
    <p>Location: <a href="http://client.com/welcome" rel="nofollow noreferrer">http://client.com/welcome</a></p>
    
    <p>Set-Cookie: auth=1479da80-197c-11e9-ba74-59606594e2fb; Path=/</p>
    
    <p>Vary: Accept</p>
    
    <p>X-Powered-By: Express</p>
  </blockquote>
  
  <p>4) The browser receives the response, which does contain the cookie 'auth'</p>
  
  <p>5) The browser redirects itself to <a href="http://client.com/welcome" rel="nofollow noreferrer">http://client.com/welcome</a></p>
  
  <p>6) 'auth' cookie is sent to <a href="http://client.com/welcome" rel="nofollow noreferrer">http://client.com/welcome</a></p>
  
  <p>Request:</p>
  
  <blockquote>
    <p>Cookie: auth=1479da80-197c-11e9-ba74-59606594e2fb</p>
  </blockquote>
  
  <p>7) <a href="http://client.com/welcome" rel="nofollow noreferrer">http://client.com/welcome</a> returns HTML but does not return the cookie 'auth'</p>
  
  <p><a href="https://i.stack.imgur.com/3B0Xc.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/3B0Xc.png" alt="enter image description here"></a></p>
  
  <p><a href="https://i.stack.imgur.com/h1nKG.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/h1nKG.png" alt="enter image description here"></a></p>
  
  <p>8) <a href="http://client.com/welcome" rel="nofollow noreferrer">http://client.com/welcome</a> makes an AJAX request to <a href="http://server.com/data" rel="nofollow noreferrer">http://server.com/data</a> (CORS enabled), but the cookie 'auth' is not sent</p>
  
  <p>9) <a href="http://server.com/data" rel="nofollow noreferrer">http://server.com/data</a> doesn't recognize the user because there is no cookie</p>
  
  <p>The client side is an angular app hosted by Node.js</p>
  
  <p><strong>Edit:</strong></p>
  
  <p>As suggested, I've added to the response of server.com:</p>
  
  <blockquote>
    <p>Access-Control-Allow-Credentials: true</p>
  </blockquote>
  
  <p>but nothing has been changed.</p>
  
  <p>Relevant client side code:</p>
  
  <pre><code>const headerOptions = new HttpHeaders({
        'Content-Type': 'application/json', 'withCredentials': 'true', 'Access-Control-Allow-Origin': 'true', 'Access-Control-Allow-Credentials': 'true'
      });
  
  this.httpClient.get&lt;any&gt;(this.baseUrl + "data", { headers: headerOptions }).subscribe((res) =&gt; {
  </code></pre>