Angular 8 httpclient how to send JSON header - asp.net

Question

Im trying to send a JSON using the angular 8 HttpClient to an ASP.net core backend using the following code:
import { HttpClient, HttpHeaders} from '#angular/common/http';
import { User } from '#/_models';
login(username, password) {
return this.http.post<any>(`https://${config.apiUrl}/api/User/LoginUser`,
JSON.stringify({
"username": username,
"password": password
})
).pipe(map(user => {
// store user details and jwt token in local storage to keep user logged in between page refreshes
localStorage.setItem('currentUser', JSON.stringify(user));
console.log(user);
this.currentUserSubject.next(user);
return user;
}));
}
}
However, when trying to send the JSON when logging in to the login page which is hosted using the command npm start, so
localhost:8080/login
is sending the request.
The request headers are:
POST /api/User/LoginUser HTTP/1.1
Host: (Checked_and_correct_API_URL)
User-Agent: Mozilla/5.0 (X11; Linux x86_64; rv:71.0) Gecko/20100101 Firefox/71.0
Accept: application/json, text/plain, */*
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate, br
Referer: http://localhost:8080/login
Content-Type: text/plain
Content-Length: 49
Origin: http://localhost:8080
DNT: 1
Connection: keep-alive
the response headers are:
HTTP/2.0 415 Unsupported Media Type
content-type: application/problem+json; charset=utf-8
server: Microsoft-IIS/10.0
x-powered-by: ASP.NET
date: Thu, 19 Dec 2019 13:10:01 GMT
content-length: 147
X-Firefox-Spdy: h2
and the sent parameters are:
{"username":"jeboimarc2","password":"KUTminor1!"}
Which is also correct
Can anyone tell me why i am getting the unsupported media type error? Thanks in advance.

Answer 1

Pass raw json data, don't convert it to string.
Try like this:
return this.http.post<any>(`https://${config.apiUrl}/api/User/LoginUser`,{"username": username, "password": password })