Uncaught (в обещании) TypeError: не удалось получить Nextjs PWA с помощью next-pwa в Chrome

Привет, я работал над проектом Nextjs, и я пытаюсь преобразовать его в PWA с помощью next-pwa, сначала я создал next.config.js

      const withPWA = require('next-pwa');

module.exports = withPWA({
    pwa: {
        dest: 'public',
      }
});

затем создал manifest.json

      {
  "name": "PRONTO APP",
  "short_name": "PRONTO",
  "icons": [
    {
      "src": "/icon.png",
      "sizes": "128x128",
      "type": "image/png"
    },
    {
      "src": "/icon-512x512.png",
      "sizes": "512x512",
      "type": "image/png"
    }
  ],
  "theme_color": "#FFFFFF",
  "background_color": "#FFFFFF",
  "start_url": "/",
  "display": "standalone",
  "orientation": "portrait"
}

И я добавляю метаданные в файл de _document на страницах

      import Document, { Html, Head, Main, NextScript } from "next/document";

class MyDocument extends Document {
    render() {
        return (
            <Html>
                <Head>
                    <link rel="manifest" href="/manifest.json" />
                    <link rel="apple-touch-icon" href="/icon.png" />
                    <meta name='theme-color' content="#fff" />
                </Head>
                <body>
                    <Main />
                    <NextScript />
                </body>
            </Html>
        );
    };
}

export default MyDocument;

Но когда я бегу:

      npm build dev 
npm start 

в Google Chrome My PWA работает нормально, но в консоли я получаю эту ошибку: в других браузерах эта ошибка не появляется

Uncaught (in promise) TypeError: Failed to fetch

И я действительно не знаю, почему, запустив приложение в моде dev с npm run dev, я получаю следующие сообщения в chrome:

      workbox Router is responding to: /
workbox Network request for '/' threw an error. TypeError: Failed to fetch
workbox Using NetworkOnly to respond to '/'
Uncaught (in promise) TypeError: Failed to fetch

Это моя структура общих папок:

      /public
-/fonts
-/images
-favicon.ico
-icon-512x512.png}
-icon.png
-manifest.json
-sw.js

В этом видео я пытался сделать то же самое.https://www.youtube.com/watch?v=8enp-acPbRE

Может ли кто-нибудь помочь мне, пожалуйста

1 ответ

Я столкнулся с той же ошибкой при использовании Chrome 89 и Workbox 6.1.1.
После обновления Chrome до 90 (и Workbox в 6.1.5), эта ошибка исчезла.

См. Соответствующую тему: https://github.com/GoogleChrome/workbox/issues/2749

Другие вопросы по тегам