search

mihaip / infinite-mac

A classic Mac loaded with everything you'd want
https://infinitemac.org
Apache License 2.0
1.12k stars 66 forks source link

Running the app on apache2 #284

Closed rocheston closed 5 months ago

rocheston commented 5 months ago

I deployed the application by running 'npm run build' and served the resulting build directory using Apache2. However, when I make attempts to run the page in a web browser, it throws a lot of errors. One recurring message I'm seeing in the browser console indicates that 'service worker is not available.

I should note that my intention is not to publish on Cloudflare Wrangler, but instead on a dedicated Apache web server. Could you provide some help with this problem?

grab10

mihaip commented 5 months ago

The most likely issue is that you need to send the same HTTP headers that the Cloudflare Worker does: https://github.com/mihaip/infinite-mac/blob/5b84d895b0b661a6027c655f434f36d046309fdf/workers-site/index.ts#L79-L90

(the most important ones being Cross-Origin-Opener-Policy, Cross-Origin-Embedder-Policy, and Service-Worker-Allowed).

The emulator runs in a worker and it needs SharedArrayBuffer to communicate efficiently with the main browser process. That needs the Cross-Origin-Opener-Policy and Cross-Origin-Embedder-Policy headers (see this page for an explanation).

As a fallback, if SharedArrayBuffer is not available (it was disabled in Safari for quite a while), I came up with a workaround that uses service worker request interception.

Note that both SharedArrayBuffer and service workers need HTTPS if served from non-localhost domains.

rocheston commented 5 months ago

I'm grateful for your solution. This has been successfully incorporated into the Apache2 virtual host and it works flawlessly. All errors have been eliminated. My sincere thanks once again.🙏

# XSS Protection Header set X-XSS-Protection "1; mode=block" # MIME type sniffing Header set X-Content-Type-Options "nosniff" # Clickjacking Header set X-Frame-Options "DENY" # Referrer Policy Header set Referrer-Policy "unsafe-url" # Feature Policy Header set Feature-Policy "none" # Cross Origin Policies Header set Cross-Origin-Opener-Policy "same-origin" Header set Cross-Origin-Embedder-Policy "require-corp" # Service Worker Header set Service-Worker-Allowed "/"
mihaip commented 5 months ago

Great!