Support Cross-Origin-Opener-Policy and Cross-Origin-Embedder-Policy on dev server

Clear and concise description of the problem

Cross-Origin-Opener-Policy and Cross-Origin-Embedder-Policy headers are necessary to support SharedArrayBuffer, as is explained in this article.

But so far, on Vite.js website and docs, there is no description of that, which would be a pain.

Here (https://vitejs.dev/config/#server-https) in docs, no examples are given.

server.https
Type: boolean | https.ServerOptions

Enable TLS + HTTP/2. Note this downgrades to TLS only when the server.proxy option is also used.

The value can also be an options object passed to https.createServer().

Usually in node.js it is set like this:

response.writeHead(200, { "Content-Type": mimeType ,
  "Cross-Origin-Opener-Policy": "same-origin",
  "Cross-Origin-Embedder-Policy": "require-corp" });

But it seems that in vite there is no way to do it?

[chaosprint]

Well, I build this plugin. It works for my purpose but may require further testing. https://github.com/chaosprint/vite-plugin-cross-origin-isolation

[ssc-hrep3]

To add custom headers, you can add the following snippet inline to the vite.config.ts file. The code is based on the plugin of @chaosprint. Thank you for that!

import { defineConfig } from 'vite';

export default defineConfig({
  plugins: [
    {
      name: 'configure-response-headers',
      configureServer: server => {
        server.middlewares.use((_req, res, next) => {
          res.setHeader('Test-Header', 'A random value');
          next();
        });
      }
    }
  ]
});