Gettting different responses from .net core api published in Azure App Service via the front-end app and postman/curl

Question

I have published asp.net core 2.2 API to Azure App Service. After last publishing I have been started getting 404 response for PUT method making request from front-end web app, but everything still is ok making request using postman or curl.

Here is the web.config:

<?xml version="1.0" encoding="utf-8"?>
<configuration>
  <location path="." inheritInChildApplications="false">
    <system.webServer>
      <handlers>
        <add name="aspNetCore" path="*" verb="*" modules="AspNetCoreModuleV2" resourceType="Unspecified" />
      </handlers>
      <aspNetCore processPath="dotnet" arguments=".\Api.dll" stdoutLogEnabled="true" stdoutLogFile="\\?\%home%\LogFiles\stdout" />
    </system.webServer>
    <httpErrors existingResponse="PassThrough" />
</location>

I have added httpErrors tag to the web.config based on this answer https://stackoverflow.com/a/46200400/11324810, but it didn't solve the problem.

The code even does not imply such a response:

[HttpPut("google-spreadsheet/sheet-header")]
public async Task<IActionResult> UpdateHeaders([FromBody]UpdateHeadersRequest request)
{
    try
    {
        var provider = await GoogleSheetExporter.CreateSheetProvider(request.SheetUrl, request.UserEmail);
        await provider.UpdateHeadersAndRecordsAsync(request.PresentCandidates.ToList(),
            request.PreviousHeaders, request.NewHeaders);
        return Ok();
    }
    catch (Exception ex)
    {
        return StatusCode(500, $"{ex.Message} | {ex.StackTrace}");
    }
}

Screeenshots with different responses:

404 response via front-end web app: https://i.stack.imgur.com/sEb2H.png

200 response via Postman: https://i.stack.imgur.com/prI09.png

200 response via curl: https://i.stack.imgur.com/1PHe7.png

Answer 1

It works in postman because that is an extension, it just sends the request. On the other hand, when sending from a browser, for security reasons, requests are sent differently.

First the browser sends an OPTIONS request to your webapi. This is to determine whether it is acceptable to send the request with these parameters.

Your backend should handle the request, respond and set response headers like:

• Access-Control-Allow-Origin

• Access-Control-Allow-Headers

• Access-Control-Allow-Credentials

• Access-Control-Allow-Methods

•

Please make sure that you have enabled the CORS in API.

After that, based on the headers of the OPTIONS response, the browser will send the PUT to http://YourAPIEndPoint IF everything is allowed, like origin, method, etc.

You can actually generate code snippet from your postman interface to see if you are missing any header

It will look something like this

Try and see if it helps.