How to properly serve third-party web worker javascript?

[t1u1]

Hi,

To give some context, I am using a third-party JS library that uses web-workers and SharedArrayBuffer. The latter requires some CORS headers to be defined, and hence I have configured vite to add those headers:

** @type {import('vite').Plugin} */
const viteHeaderPlugin = {
    name: 'add headers',
    configureServer: (server) => {
        server.middlewares.use((req, res, next) => {
            res.setHeader("Access-Control-Allow-Origin", "*");
            res.setHeader("Access-Control-Allow-Methods", "GET");
            res.setHeader("Cross-Origin-Opener-Policy", "same-origin");
            res.setHeader("Cross-Origin-Embedder-Policy", "require-corp");
            next();
        });
    }
};

export default defineConfig({
	plugins: [sveltekit(), viteHeaderPlugin],
});

And I have added the worker.js asset to static/ folder. But when worker.js is served, it is not served with the above specified response headers. It looks like svelte-kit plugin directly serves from the static folder, and doesn't give a chance for my custom vite plugin to add the headers.

Is my understanding correct? How do I fix it?

[t1u1]

I was able to solve this by changing the order of plugins:

plugins: [viteHeaderPlugin, sveltekit()]

[ghostdevv]

Vite config has an option for setting headers @t1u1

[t1u1]

Yeah, I tried that, though it never worked for me, not even for regular routes.