diff --git a/.changeset/small-dingos-give.md b/.changeset/small-dingos-give.md new file mode 100644 index 00000000..4b041197 --- /dev/null +++ b/.changeset/small-dingos-give.md @@ -0,0 +1,7 @@ +--- +"@ducanh2912/next-pwa": patch +--- + +fix(cache-on-front-end-nav): fixed error 'URL object could not be cloned.' + +- This was due to us trying to send the URL object to our worker through `postMessage`. diff --git a/docs/content/index.mdx b/docs/content/index.mdx index 1086ded8..1f69d696 100644 --- a/docs/content/index.mdx +++ b/docs/content/index.mdx @@ -8,7 +8,3 @@ type: Docs Take a look around: - [`next-pwa`](/docs/next-pwa/getting-started) - -## What's the plan for the future? - -- In the future, I plan on supporting [`Turbopack`](https://turbo.build/pack) as soon as we get our hands on them. diff --git a/docs/content/next-pwa/index.mdx b/docs/content/next-pwa/index.mdx index dcfef17b..2887fec0 100644 --- a/docs/content/next-pwa/index.mdx +++ b/docs/content/next-pwa/index.mdx @@ -20,7 +20,7 @@ It is also really configurable as it uses Workbox under the hood to build the se See [Getting started](/docs/next-pwa/getting-started). It should have abundant information on how to set the plugin up, including additional information for older versions of Next.js and tips! -## And how to configure it? +## How to configure it? See [Configuring](/docs/next-pwa/configuring). All available options are listed there! diff --git a/packages/next-pwa/src/sw-entry-worker.ts b/packages/next-pwa/src/sw-entry-worker.ts index c50c6aa5..c8079d6a 100644 --- a/packages/next-pwa/src/sw-entry-worker.ts +++ b/packages/next-pwa/src/sw-entry-worker.ts @@ -4,11 +4,11 @@ export type MessageType = | { type: "__FRONTEND_NAV_CACHE__"; shouldCacheAggressively: boolean; - url: URL | string; + url: string; } | { type: "__START_URL_CACHE__"; - url: URL | string; + url: string; }; self.onmessage = async (ev: MessageEvent) => { diff --git a/packages/next-pwa/src/sw-entry.ts b/packages/next-pwa/src/sw-entry.ts index 0c2c2b92..5296d235 100644 --- a/packages/next-pwa/src/sw-entry.ts +++ b/packages/next-pwa/src/sw-entry.ts @@ -37,18 +37,31 @@ if ( if (__PWA_CACHE_ON_FRONT_END_NAV__ || __PWA_START_URL__) { const cacheOnFrontEndNav = async ( - url?: string | URL | null | undefined + originalUrl?: string | URL | null | undefined ) => { - if (!window.navigator.onLine || !url) { + if (!window.navigator.onLine) { return; } - const isStartUrl = !!__PWA_START_URL__ && url === __PWA_START_URL__; + + const url = originalUrl + ? originalUrl instanceof URL + ? originalUrl.toString() + : typeof originalUrl === "string" + ? originalUrl + : undefined + : undefined; + + if (typeof url !== "string") return; + + const isStartUrl = + !!__PWA_START_URL__ && originalUrl === __PWA_START_URL__; + if (isStartUrl) { if (!swEntryWorker) { - const response = await fetch(url); + const response = await fetch(originalUrl); if (!response.redirected) { const startUrlCache = await caches.open("start-url"); - return startUrlCache.put(url, response); + return startUrlCache.put(originalUrl, response); } } else { swEntryWorker.postMessage({