C#•2mo ago

✅ Blazor WASM Headers

How can I set headers? Cross-Origin-Embedder-Policy: require-corp Cross-Origin-Opener-Policy: same-origin It's WASM standalone and I'm on MacOS, so no IIS.

9 Replies

hoodie•2mo ago

Since it’s not IIS, you’ll need to handle headers in whatever HTTP server you’re using. Here are the simplest ways depending on your setup: --- 1. Using Python’s built-in HTTP server with headers Python’s standard http.server doesn’t let you set headers by default, but you can subclass it:

from http.server import SimpleHTTPRequestHandler, HTTPServer

class COOPHandler(SimpleHTTPRequestHandler):
    def end_headers(self):
        self.send_header("Cross-Origin-Embedder-Policy", "require-corp")
        self.send_header("Cross-Origin-Opener-Policy", "same-origin")
        super().end_headers()

port = 8000
httpd = HTTPServer(('localhost', port), COOPHandler)
print(f"Serving on http://localhost:{port}")
httpd.serve_forever()

from http.server import SimpleHTTPRequestHandler, HTTPServer

class COOPHandler(SimpleHTTPRequestHandler):
    def end_headers(self):
        self.send_header("Cross-Origin-Embedder-Policy", "require-corp")
        self.send_header("Cross-Origin-Opener-Policy", "same-origin")
        super().end_headers()

port = 8000
httpd = HTTPServer(('localhost', port), COOPHandler)
print(f"Serving on http://localhost:{port}")
httpd.serve_forever()

Run with:

python3 server.py

python3 server.py

Your WASM app will now receive the necessary headers. --- 2. Using Node.js / Express If you prefer Node.js:

const express = require('express');
const path = require('path');
const app = express();

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

app.use(express.static(path.join(__dirname, 'public'))); // WASM files here

app.listen(8000, () => console.log('Server running on http://localhost:8000'));

const express = require('express');
const path = require('path');
const app = express();

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

app.use(express.static(path.join(__dirname, 'public'))); // WASM files here

app.listen(8000, () => console.log('Server running on http://localhost:8000'));

Then run:

node server.js

node server.js

--- 3. Using a lightweight server like serve If you just want something quick:

npm install -g serve
serve -l 8000 --cors

npm install -g serve
serve -l 8000 --cors

Unfortunately, serve doesn’t allow custom headers directly. For WASM, Python or Node.js is usually easier. --- ✅ Tip: Both Cross-Origin-Embedder-Policy: require-corp and Cross-Origin-Opener-Policy: same-origin are needed for SharedArrayBuffer in WASM to work in modern browsers.

JamesOP•2mo ago

I am just using a normal launchSetting profile for "Project". I dont know how that serves the static files. I also want to still be able to debug. Surely this is a common case?

Pobiega•2mo ago

Please don't use AI to answer questions here, especially not incorrectly. You are not helping and will be banned if you continue. You'll want to configure a CORS policy in ASP.NET, at least for development. When built for "production" so to speak there is no server for blazor WASM, its all client side - much like a javascript application. CORS is entirely managed on the server, so if your WASM app sends external requests to another API, that is where you will need to configure CORS

JamesOP•2mo ago

These headers are needed to access things like multithreading and OPFS, at the moment I am using dotnet serve with the headers after publishing. I dont know how rider is serving the standalone wasm app when ran via launchsettings, would be a much nicer dev experience especially for debugging if I could integrate directly

Pobiega•2mo ago

Hm. I see the problem. I can't find any information on how to configure blazor-devserver.dll to serve with custom headers I've asked in #web, hopefully someone there knows if its at all possible.

hoodie•2mo ago

it's not AI is chatgpt I read the rules

Pobiega•2mo ago

ChatGPT is an LLM my guy

leowest•2mo ago

the fact you used chatgpt to generate a completely random generic answer that is unrelated to c# and you don't even know, is already a sign u should just stop using it. its great you want to help and we appreciate that, but do so by not using chatgpt and related technologies.

Jimmacle•2mo ago

if people wanted to ask chatgpt they'd ask chatgpt, dumping AI generated nonsense that you don't understand at someone asking for help is harmful to the purpose of these channels

Gaming

Programming

✅ Blazor WASM Headers

Did you find this page helpful?