Update develop.md sw docs
turns out http://localhost runs service workers just fine on all desktop browsers 🤷pull/751/head
parent
83eb4c39e5
commit
fa418eef16
|
@ -267,37 +267,8 @@ Reference: <https://stackoverflow.com/questions/34160509/options-for-testing-ser
|
||||||
|
|
||||||
- Set the `web_push_public_key` correctly.
|
- Set the `web_push_public_key` correctly.
|
||||||
|
|
||||||
4. Run `ENABLE_DEV_PWA=1 npm run start` - this enables the dev service worker
|
4. Run `npm run start`
|
||||||
|
|
||||||
5. Set your browser to allow testing service workers insecurely:
|
|
||||||
|
|
||||||
- Chrome:
|
|
||||||
|
|
||||||
Open Chrome with special flags allowing insecure localhost service worker testing insecurely
|
|
||||||
|
|
||||||
```sh
|
|
||||||
# for example, macOS
|
|
||||||
/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome \
|
|
||||||
--user-data-dir=/tmp/foo \
|
|
||||||
--unsafely-treat-insecure-origin-as-secure=http://localhost:3000,http://localhost
|
|
||||||
```
|
|
||||||
|
|
||||||
- Firefox:
|
|
||||||
|
|
||||||
See here: https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API
|
|
||||||
|
|
||||||
> Note: On Firefox, for testing you can run service workers over HTTP (insecurely); simply check the Enable Service Workers over HTTP (when toolbox is open) option in the Firefox Devtools options/gear menu
|
|
||||||
|
|
||||||
- Safari, iOS:
|
|
||||||
|
|
||||||
There doesn't seem to be a good way to do this currently. The only way is to serve a valid HTTPS certificate.
|
|
||||||
|
|
||||||
This is beyond the scope of this guide, but you can try `mkcert`, a number of reverse proxies such as Traefik and Caddy,
|
|
||||||
or tunneling software such as [Cloudflare Tunnels][cloudflare_tunnels] or ngrok.
|
|
||||||
|
|
||||||
[cloudflare_tunnels]: https://developers.cloudflare.com/cloudflare-one/connections/connect-apps/do-more-with-tunnels/trycloudflare/
|
|
||||||
|
|
||||||
6. Open <http://localhost:3000/>
|
|
||||||
#### With a built package
|
#### With a built package
|
||||||
|
|
||||||
1. Run `make web-build`
|
1. Run `make web-build`
|
||||||
|
|
|
@ -3,13 +3,6 @@ import { defineConfig } from "vite";
|
||||||
import react from "@vitejs/plugin-react";
|
import react from "@vitejs/plugin-react";
|
||||||
import { VitePWA } from "vite-plugin-pwa";
|
import { VitePWA } from "vite-plugin-pwa";
|
||||||
|
|
||||||
// please look at develop.md for how to run your browser
|
|
||||||
// in a mode allowing insecure service worker testing
|
|
||||||
// this turns on:
|
|
||||||
// - the service worker in dev mode
|
|
||||||
// - turns off automatically opening the browser
|
|
||||||
const enableLocalPWATesting = process.env.ENABLE_DEV_PWA;
|
|
||||||
|
|
||||||
export default defineConfig(() => ({
|
export default defineConfig(() => ({
|
||||||
build: {
|
build: {
|
||||||
outDir: "build",
|
outDir: "build",
|
||||||
|
@ -18,7 +11,6 @@ export default defineConfig(() => ({
|
||||||
},
|
},
|
||||||
server: {
|
server: {
|
||||||
port: 3000,
|
port: 3000,
|
||||||
open: !enableLocalPWATesting,
|
|
||||||
},
|
},
|
||||||
plugins: [
|
plugins: [
|
||||||
react(),
|
react(),
|
||||||
|
@ -27,7 +19,7 @@ export default defineConfig(() => ({
|
||||||
injectRegister: "inline",
|
injectRegister: "inline",
|
||||||
strategies: "injectManifest",
|
strategies: "injectManifest",
|
||||||
devOptions: {
|
devOptions: {
|
||||||
enabled: enableLocalPWATesting,
|
enabled: true,
|
||||||
/* when using generateSW the PWA plugin will switch to classic */
|
/* when using generateSW the PWA plugin will switch to classic */
|
||||||
type: "module",
|
type: "module",
|
||||||
navigateFallback: "index.html",
|
navigateFallback: "index.html",
|
||||||
|
|
Loading…
Reference in New Issue