Set-Cookie in Response Header not being created in browser - Using http POST
<p>I have been stuck on such issue related to cookies.</p>

<p>My scenario is this:</p>

<ul>
<li>I have my backend on server (localhst:12456) </li>
<li>I have my Angular 2 app running on another server (localhost:5555)</li>
</ul>

<p>My backend is just an ASP.NET application and I am trying to authenticate user from an apiController. the api Controller is like this:</p>

<pre><code>[System.Web.Mvc.HttpPost]
        public HttpResponseMessage HandleLogin([FromBody] LoginModel loginModel)
        {
            if (!String.IsNullOrEmpty(loginModel.Username) &amp;&amp; !String.IsNullOrEmpty(loginModel.Password))
            {

                if (Members.Login(loginModel.Username, loginModel.Password))
                {
                    var resp = Request.CreateResponse&lt;UserAuthenticationModel&gt;(
                         HttpStatusCode.OK,
                        new UserAuthenticationModel() { IsAuthenticated = true}
                    );

                    //create and set cookie in response
                    var cookie = new CookieHeaderValue("customCookie", "cookieVal");
                    cookie.Expires = DateTimeOffset.Now.AddDays(1);
                    cookie.Domain = Request.RequestUri.Host;
                    cookie.Path = "/";
                    resp.Headers.AddCookies(new CookieHeaderValue[] { cookie });

                    return resp;
                }
            }

            return Request.CreateResponse&lt;UserAuthenticationModel&gt;(
                  new UserAuthenticationModel() { IsAuthenticated = false }
            );
        }
</code></pre>

<p>Now, from my angular app, I am calling an http post:</p>

<p>headers.append('Access-Control-Allow-Credentials', true);</p>

<pre><code>    return this._http.post(this._globalVariables.BACKEND_API_HANDLE_LOGIN, loginModel, {headers: headers})
                .map((response : Response) =&gt; response);
</code></pre>

<p>this._loginService.getLoginModel()
            .subscribe(
                loginModel => this._signInPageModel = loginModel,
                error => console.log(error)
            );
Now, in my api controller method (HandleLogin) I have a test cookie and another one for FormsAuthentication and when user logged in successfully, and return back to my angular app, no cookies are created.</p>

<p>Now, the cookies can be seen as well as post of my response headers:</p>

<p><a href="https://i.stack.imgur.com/uZ3pa.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/uZ3pa.jpg" alt="enter image description here"></a></p>

<p>I'm quite confusing about it and appreciate any help in order to get the login process successfully.</p>

<p>Thank you in advance.</p>