1

I'm hosting a NodeJS application on google cloud app engine. Utilizing Vite & Vue3 alongside Vite's native SSR. Currently, the application works fine with the google subdomain: <domain>.appspot.com. However, when I try using the domain I mapped to ie: domain.com, it shows this error:

Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec.

Sometimes it seems to work randomly, however, most of the time it creates the mime type error. This occurs for both JavaScript & CSS files which are served as files with HTML content.

Similar Issue: Mismatched MIME type with Google App Engine

This is my first time posting here so please let me know if there's anything else I need to add.

Some Notes

  • I've noticed that the mime type issue only occurs for the index page (so domain.com/) and not for pages like domain.com/test.
  • Running the production server (building & serving) doesn't have any issues
  • Since I'm using Vue Router, I've noticed that first loading the page as domain.com/test and then moving over to domain.com works. So there's no mime issue when vue renders the index page.
  • I'm also using express.static to serve static files, and not use the App Engine handlers configuration. I've tried switching from express to serving static from app engine but that also didn't work that well.

Edit After some investigation, seems like the files are not being found. I'm going to assume this is an issue with how Google Cloud is fetching the files. Will continue to update.

Ruchir Acharya
  • 11
  • 2

2 Answers2

0

I have also found that today my app stopped providing a correct Content-type header when downloading a PDF preview with use of express. So, with the simplest

return res.writeHead(200, {
  'Content-Disposition': `inline;filename=filename.pdf`,
  'Content-Type': 'application/pdf'
}).send();

I get text/html when request it regardless it is totally fine on the local debug machine and it actually worked yesterday. Probably, it is some update on the App Engine side?

Tyler2P
  • 2,324
  • 26
  • 22
  • 31
Luno
  • 35
  • 8
  • Not sure if that's the issue. I've noticed that going on the index so domain.com tries to load differently named CSS/JS files as compared to going on domain.com/test. I'm guessing there's some sort of caching issue. – Ruchir Acharya Feb 01 '23 at 20:32
  • Oops, it might be also due to a problem with code... – Luno Feb 02 '23 at 01:50
  • It's currently working on development & when I run prod on my local machine. It also works *most* of the time w/ the google app service subdomain. I'm thinking it's either an issue with cache or google cloud. – Ruchir Acharya Feb 02 '23 at 17:53
0

I seem to have solved it. It was an issue with Google Cloud's caching the "index" route.

res
            .status(200)
            .set({ "Content-Type": "text/html" })
            .set({
                etag: false,
                lastModified: false,
            })
            .end(HTML);

^ I used that code when serving routes now so it'll ensure google cloud doesn't cache the page and try to fetch old css/js files.

Reference: Google App Engine, index.html cached after deploy in express/react app

Ruchir Acharya
  • 11
  • 2