I have a little private Project and now I'm hanging with cookies.
First of all I want to show you some code:
UserServiceControler.cs
[HttpPost("IsAuthenticated")]
public IActionResult IsAuthenticated([FromBody] IsAuthenticatedRequest request) {
var hash = _userService.IsAuthenticated(HttpContext, request);
switch (hash) {
case "200":
case "401":
return new StatusCodeResult(Convert.ToInt32(hash));
default:
if (HttpContext.Request.Cookies.Contains("TEST")) {
HttpContext.Response.Cookies.Delete("TEST");
}
HttpContext.Response.Cookies.Append("Test", hash, new CookieOptions() {
HttpOnly = true,
Secure = true,
IsEssential = true,
Domain = "localhost",
Expires = new DateTimeOffset(DateTime.Now).AddMinutes(20.0)
});
return new StatusCodeResult(200);
}
}
Proxy.conf.json
{
"/api/*": {
"target": "https://localhost:5001",
"secure": false,
"topLevel": "debug",
"changeOrigin": true
},
"/login.html": {
"target": "http://localhost:4200/assets/pages",
"secure": false
},
"/": {
"target": "http://localhost:4200",
"secure": false
}
}
login.html just function
var paramString = "{username: \"test\", password: \"test\"}";
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
window.location.href = "/";
} else if (this.status == 401) {
alert("1");
}
};
xhttp.open("POST", "/api/UserService/IsAuthenticated", true);
xhttp.withCredentials = true;
xhttp.setRequestHeader("Content-type", "application/json-patch+json");
xhttp.setRequestHeader("Access-Control-Allow-Origin", "*");
xhttp.setRequestHeader("Access-Control-Allow-Credentials", "true");
xhttp.send(paramString);
When I test my IsAuthenticated via Swagger, I get my cookie with all I want. But when I want to use this in my Angular app, i don't get my cookie.
How does it works:
Normally when I call /api/UserService/IsAuthenticated
, in swagger, and give him a username and a password it sets the cookie in my browser. This makes my happy because this shows me that my api is not the problem.
Now it comes to Angular.
I start my app via npm start
and this makes that ng serve --proxy-config proxy.conf.json
nothing special.
In my index.html is the same code as in login.html just with test username and password because it looks at the cookie in my api.
So I go to localhost:4200
. First it should redirect me to localhost:4200/login.html
because I'm not logged in. This works.
Now in login.html I give him my username and my password --> wait some ms --> and i get StatusCode 200 and in my Brower Console at network i see my request with a response cookie. But it isn't set in my browser. This is not good. That I get redirected to localhost:4200
because StatusCode is 200 and at index.html
he checks again if i'm Authenticated and I get redirected back to localhost:4200/login.html
because of cookie is not there.
Can anyone help me please with this cookie problem? Or is there a better way how I can make this user session?