'Azure ASP.NET Core web api returns 404 for proxied multipart/form-data request

I'm new to Azure and trying to set up my nextjs client app and my ASP.NET Core backend app. Everything seems to play well now, except for file uploads. It's working on localhost, but in production the backend returns a 404 web page (attached image) before reaching the actual API endpoint. I've also successfully tested to make a multipart/form-data POST request in Postman from my computer.

404 Response

The way I implemented this is that I'm proxying the upload from the browser through an api route (client's server side) to the backend. I have to go via the client server side to append a Bearer token from a httpOnly cookie.

I've enabled CORS in Startup.cs:

app.UseCors(builder => { builder.AllowAnyOrigin().AllowAnyHeader().AllowAnyMethod(); });

The frontend and backend apps are running in individual services and I've tried to enable CORS in the Azure portal as well, but there I could only allow origins, not headers and methods? The error message doesn't indicate CORS problems, but I just wanted make sure..

As far as I can see the requests look good, with correct URLs and origins. I suspect I'm missing some config in azure, but I didn't get any further by following the hints in the error message.

Any suggestions to what may cause this? Or where I can start looking. I'm not quite sure where to look for log output for this issue.



Solution 1:[1]

I finally got this working. I figured the host header in the proxy http request was unchanged. I only changed the URL for the proxy request, but I solved it by setting the host manually as well. This also explains why it was working at localhost, since both the client and backend was running at the same host.

Solution 2:[2]

  • Cross-Origin Resource Sharing (CORS) allows JavaScript code running in a browser on an external host to interact with your backend.

  • To allow all, use "*" and remove all other origins from the list.

I could only allow origins, not headers and methods?

Add the below configuration in your web.config file to allow headers and methods.

<system.webServer>
  <httpProtocol>
    <customHeaders>
      <add  name="Access-Control-Allow-Origin"  value="*"  />
      <add  name="Access-Control-Allow-Headers"  value="Content-Type"  />
      <add  name="Access-Control-Allow-Methods"  value="GET, POST, PUT, DELETE, OPTIONS"  />
    </customHeaders>
  </httpProtocol>
</system.webServer>

Add the below snippet in web.config=><system.webServer> =>handlers tag

<?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=".\yourURI.dll" stdoutLogEnabled="false" stdoutLogFile="\\?\%home%\LogFiles\stdout" hostingModel="InProcess" />
        </system.webServer>
    </location>
</configuration>
  • Make sure the routing is done properly

[Route("api/[controller]")] should be in your controller class.

client cache is still pointing to the domain to ols ip address. clear the cache by running the command ipconfig/flushdns

Please refer Custom domain has not been configured inside Azure ,Azure WebApps Custom Domain 404 error - Flush DNS and SO Thread for more information

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Oyvindse
Solution 2