[SOLVED] reactjs: files served into public folder resolve into a 404 error in production build but work in development with npm start

reactjs: files served into public folder resolve into a 404 error in production build but work in development with npm start

I am trying to serve 2 files needed by javascript for a web assembly package. The files example.wasm and example.data are in the public folder in the react js project file structure. When running with a development server using npm start, the files can be found by the project and can be read correctly. When building the project the files end up in the root directory of the project as expected. In spite of using the current PUBLIC_URL path for the files, the files can not be found, but the paths in the web console seem to be correct.

I am hosting the reactjs app from IIS 7.

Can you help me with the process to debug the problem described above?

Thank you in advance for your help.

Solution

After the help of @LexLi I have enabled the Failed Request Tracing Module in the IIS following this documentation:

[https://learn.microsoft.com/en-us/iis/troubleshoot/using-failed-request-tracing/troubleshooting-failed-requests-using-tracing-in-iis][1]

Reading the log generated by the Failed Request Tracing Module I saw that when requesting the files example.wasm and example.data from the server the actual error was not 404 Not Found but:

SECURITY_DENIED_BY_MIMEMAP

After googling the error above I realized that the Default MIME Types configured in the IIS do not include files with extensions .data and .wasm. After adding those MIME Types to the IIS configuration using the MIME Type Module in the Web Server Level in IIS Management and restarting the server the problem was resolved.