#Anyone know how to configure Content-Type in server.headers?

1 messages · Page 1 of 1 (latest)

hard ivy
#

Trying to deploy my app on a kindle, but it's only showing a white page because the Content-Type is not "application/javascript" All my .jsx files and my client file have to include this header apparently.

It works fine in the browser though. How would I configure this in vite.config?

worn kettle
#

This is just a guess but try setting the type attribute? https://www.w3schools.com/tags/att_script_type.asp

#

The kindle app is loading the bundled assets? Or are you trying to access you dev server?

hard ivy
#

I can access it in the browser but it doesn’t work on mobile devices. I talked to the team that manages the mobile devices and they told me to change my content-type to “application/JavaScript” to get it work. Not entirely sure if it’s loading the assets or not, the mobile devices are pretty locked down.

worn kettle
#

Try updating the script type attribute, I have no idea how else you would address this. Have you found anyone else on Google that has this issue?

#

Is this an internal app? Or public app?

#

You specifically were asking about setting the server headers. How is this running on the mobile apps? Is it bundled then deployed onto the devices? Setting the server headers will help with setting the headers for local dev but it doesn’t apply to the bundle

hard ivy
#

I mean in express I would just do app.use or whatever and do res.setHeader('whatever here') and be done with it

#

but not exactly sure how to do this with vite, it doesn't really show any examples on the docs and just says 'server.headers' and that's it.

hard ivy
#

Oh cool, the tablet team said this: I had a chance to look further into the issue, and it looks like the <script> tag is the issue. It seems that the type="module" attribute is not supported in the version of webview and needs to be ommitted or set to type="text/javascript. Beyond this, I can't help troubleshoot the specifics of the app but I can provide the tools and process I'm using to find this information and a way to test to verify if the app will work on kayak devices

worn kettle
#

Ah yes there is someone else on discord who ran into a vaguely similar problem. He wrote a script to remove the type attribute although it would be much easier if you create a transform html plug-in which will also allow you to do a string replace on the html

#

Refer to vite plug-in api, they have a basic example of how to change the generated html

hard ivy
#

So how would I do this exactly?

worn kettle
#

After you look at the plug-in api for transform index html, There is a basic example of how to do it. You would modify their example to string replace type=module to an empty string

hard ivy
#

So I think I fixed it. I had to npm run build

#

and then npm run preview

#

npm run dev was the reason why it was getting blocked.