stephanrauh / ngx-extended-pdf-viewer

A full-blown PDF viewer for Angular 16, 17, and beyond
https://pdfviewer.net
Apache License 2.0
469 stars 176 forks source link

Error Loading PDF Viewer on Azure App Service #2457

Closed rmdorsey closed 1 month ago

rmdorsey commented 1 month ago

This error is very similar to what's described here: https://github.com/stephanrauh/ngx-extended-pdf-viewer/issues/2176

The PDF viewer is displaying PDFs fine locally, but when it's deployed to production on Azure it's not displaying the PDF.

I'm seeing this error in the browser console: "Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/plain". Strict MIME type checking is enforced for module scripts per HTML spec." image

I've attempted to fix the issue by doing the following: a) I've added this to my web.config file: image

b) I've added this to angular.json: image

Thanks for all that you do! Matt

stephanrauh commented 1 month ago

Just to be sure, have a look at the response when the browser if fetching the pdf*.mjs file. If there's an mistake with your angular.json, you'll see the index.html instead of the expected JavaScript file.

If it's really a MIME type problem, have a look at https://github.com/stephanrauh/ngx-extended-pdf-viewer/issues/2196#issuecomment-2005853323. There seems to be a UI to configure the MIME types.

There's also a StackOverflow article, but I'm afraid it only adds to the confusion: https://stackoverflow.com/questions/77780497/mime-type-of-mjs-file-from-azure-app-service-is-text-plain-only-in-productio

stephanrauh commented 1 month ago

If you've found a solution, would you mind to tell me so I can close the ticket?

rmdorsey commented 1 month ago

Still working to resolve this one. I've got a thread going with Azure and will hopefully have a screen share session with them soon. Here's the q&a I've got going: https://learn.microsoft.com/en-us/answers/questions/1840483/azure-app-service-is-failing-to-load-a-module-scri

rmdorsey commented 1 month ago

Azure support asked me to change the .mjs file to .js... Is that possible?

stephanrauh commented 1 month ago

No, that's not possible. I already tried. There are several import statement I'd have to replace with something else, and it seems to be a lot of work.

BTW, mjs files aren't new, so I wonder why server manufacturer don't support them by default.

stephanrauh commented 1 month ago

The most elegant solution would be to import the *.mjs files in an Angular component. As far as I remember, we've already discussed this in #2337.

rmdorsey commented 1 month ago

I gave up on their app service (linux os), but I was able to get it working on their static web app service. Thanks!

stephanrauh commented 1 month ago

OK - that's slightly disappointing. I really hope there's a solution to the root problem. However, it seems you've found a solution, and that makes me happy!

Best regards, Stephan