When attempting to pass a JSON Object from a TypeScript POST call to a Web API method, I have encountered an issue. Fiddler indicates that the object has been successfully converted into JSON with the Content-Type set as 'application/JSON'. However, upon reaching the API controller, the parameter value is displaying as null instead of the expected JSON.
Here is the TypeScript code snippet:
createPO(product: string): Promise<string> {
var headers = new Headers();
headers.append('Content-Type', 'application/json');
let options = new RequestOptions({ headers: headers });
return this._http.post(this._creatPOUrl, JSON.stringify(product), options)
.toPromise()
.then(response => <string>response.statusText)
.catch(this.handleError);
}
And here is the corresponding Web API code:
[HttpPost] public async Task CreatePOInMO([FromBody] string product) { return Ok(); }
The issue arises where the 'product' parameter contains null. While manually passing the actual value inside the 'product' object in TypeScript (which is valid JSON) works, hard coding values like this is not a viable solution for my scenario.
I came across a discussion on Stack Overflow regarding a similar issue titled Angular2 Service not passing JSON to WebAPI. Although I followed the suggestions mentioned in the post, it seems that I am still facing the same problem.