I'm trying to issue a POST of a JSON content from an Angular 4 single-page application (runs locally over http://localhost:4200/) to a REST WCF webservice endpoint (runs locally, and the endpoint is the following: http://localhost:3026/ToshlSrvc.svc/Add).
I use standard Http.post() method + RxJs extensions in order to issue the POST request. The webservice actually receive the POST and relative content and it correctly does what it's designed for (adds the deserialized object to an Entity Framework context, persist to DB and returns the new Id), so there's no error at all client side nor server side.
Unfortunately the "data" args of the subscribe() method used to listen over http.post() is always NULL! I can't get the new Id contained into the POST response! But if i check in network activities of Chrome or if i issue a post with PostMan i see that the response body is the following:
<int xmlns="http://schemas.microsoft.com/2003/10/Serialization/">1250</int>
(1250 in this case is the correct new ID)
I can't figure out what's wrong here. Have you got some suggestions?
Any help is appreciated.
THE CASE
Here's the TypeScript code of how i reach the webService:
public Add(resource: Entry): void{
const WEBSERVICE_ADDRESS: string = "http://localhost:3026/ToshlSrvc.svc";
const headers = new HttpHeaders().set( 'Content-Type', 'application/json; charset=utf-8');
return this.http.post(this.WEBSERVICE_ADDRESS + '/Add', JSON.stringify(resource), { headers: headers})
.catch(this.handleError);
.subscribe(data => {
console.log(data); //I always get null!
});
}
Here's the declaration of the webservice's endpoint:
[WebInvoke(Method = "POST", RequestFormat = WebMessageFormat.Json, UriTemplate = "/Add")]
int Add(EntryDTO entry);
The body of my webservice's endpoint:
int IToshlSrvc.Add(EntryDTO entry)
{
Entry newEntry = null;
//Create new entry and add to collection
if (entry.Type == eTypeDTO.Expense) {
newEntry = new ExpenseEntry();
newEntry.Id = this._provider.Expenses.Max(x => x.Id) + 1;
this._provider.Expenses.Add((ExpenseEntry)newEntry);
}
else {
newEntry = new IncomeEntry();
newEntry.Id = this._provider.Incomes.Max(x => x.Id) + 1;
this._provider.Incomes.Add((IncomeEntry)newEntry);
}
//Set values
newEntry.Categories = entry.Categories;
newEntry.Date = Convert.ToDateTime(entry.Date);
newEntry.Description = entry.Description;
newEntry.Value = entry.Value;
//Returns
return newEntry.Id;
}
The OPTIONS preflight and POST request check: https://www.dropbox.com/s/900q3oor6dex0hl/issueOPTIONS.png?dl=0 https://www.dropbox.com/s/no8o78oqsolxk21/issuePOST.png?dl=0
In order to allow communication between these different domains i've enabled CORS like exposed here https://enable-cors.org/server_wcf.html + i needed to add an empty GetOptions() endpoint in my webservice like exposed here: Ajax POST to WCF Rest CORS-compliant WebService throws error 405.
I needed to do this because the Enable-Cors.org strategy doesn't work at all without the abovementioned GetOptions() method. I think that this point or a wrong CORS settings can concur in this problem.
