slow_learner
slow_learner

Reputation: 23

Setting Cross-origin-Embedder-Policy and Cross-origin-Opener-Policy headers in Express

I've been developing a website using Express for the backend and React for the frontend. I've come across the issue where my application won't work on Firefox due to this error: 'ReferenceError: SharedArrayBuffer is not defined.' After searching a bit online, it appears to be related to CORS. I also noticed that Chrome issues a warning about the use of SharedArrayBuffer.

So, I read that I need to set these headers: Cross-Origin-Opener-Policy: same-origin and Cross-Origin-Embedder-Policy: require-corp.

But I am not sure how to do that. On my backend, I've been using the 'cors' package to set my CORS headers and options like this:

const corsMiddleware = cors({
  credentials: true,
  origin: allowedCorsOrigins
});
app.use(corsMiddleware);

app.options('*', corsMiddleware);

I've also tried using this method, but it doesn't appear to work either:

app.use((req, res, next) => {
  res.setHeader('Cross-Origin-Opener-Policy', 'same-origin');
  res.setHeader('Cross-Origin-Embedder-Policy', 'require-corp');
  next();
});

Am I totally missing something or misunderstanding? It is my first time developing a web application, and I am kind of lost at this point. Any help would be greatly appreciated.

Upvotes: 1

Views: 817

Answers (0)

Related Questions