зарегистрировать работника сервиса в ASP. net приложении «реакция» для прогрессивного веб-приложения - PullRequest
0 голосов
/ 09 февраля 2020

В качестве игрушечного проекта я создал веб-приложение реагирования с помощью приложения create-реагировать. Затем я изменил "serviceworker.unregister ()" на "serviceworker.register ()" в индексе. js. Проект игрушек находится на Github здесь: https://github.com/verybadcat/CreateReactAppPwa. Затем я попробовал аудит Google на маяке с помощью двух разных способов запуска приложения.

Если я запустил его с «npm start», маяк был недоволен несколькими вещами. На данный момент меня интересуют три:

Current page does not respond with a 200 when offline
start_url does not respond with a 200 when offline
Does not register a service worker that controls page and start_url

Он также жаловался, что я не использовал https. Сейчас я хочу отложить это в сторону.

С другой стороны, если я запустил его с помощью "npm run build" и скопировал URL-адрес этой команды в мой браузер, Маяк пожаловался только на https.

Теперь о реальном проекте. Настоящий проект - приложение реакции netcoreapp3.0. На данный момент это по сути шаблонный проект Microsoft. У него есть индекс файла. js, который выглядит следующим образом:

import 'bootstrap/dist/css/bootstrap.css';
import React from 'react';
import ReactDOM from 'react-dom';
import { BrowserRouter } from 'react-router-dom';
import App from './App';
import registerServiceWorker from './registerServiceWorker';

const baseUrl = document.getElementsByTagName('base')[0].getAttribute('href');
const rootElement = document.getElementById('root');

ReactDOM.render(
  <BrowserRouter basename={baseUrl}>
    <App />
  </BrowserRouter>,
  rootElement);

// Uncomment the line above that imports the registerServiceWorker function
// and the line below to register the generated service worker.
// By default create-react-app includes a service worker to improve the
// performance of the application by caching static assets. This service
// worker can interfere with the Identity UI, so it is
// disabled by default when Identity is being used.
//
registerServiceWorker();

Вызванный мной комментарий registerServiceWorker переходит к файлу из проекта по умолчанию, который выглядит так:

export default function register () {
  if (process.env.NODE_ENV === 'production' && 'serviceWorker' in navigator) {
    // The URL constructor is available in all browsers that support SW.
    const publicUrl = new URL(process.env.PUBLIC_URL, window.location);
    if (publicUrl.origin !== window.location.origin) {
      // Our service worker won't work if PUBLIC_URL is on a different origin
      // from what our page is served on. This might happen if a CDN is used to
      // serve assets; see https://github.com/facebookincubator/create-react-app/issues/2374
      return;
    }

    window.addEventListener('load', () => {
      const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;

      if (isLocalhost) {
        // This is running on localhost. Lets check if a service worker still exists or not.
        checkValidServiceWorker(swUrl);
      } else {
        // Is not local host. Just register service worker
        registerValidSW(swUrl);
      }
    });
  }
}```

Проблема в том, что в каждом случае, который я пробовал, поведение такое же, как и в «отладочной» версии игрушечного приложения. Это включает в себя как отладку, так и сборку проекта. Маяк, похоже, не видит обслуживающего работника. Я вижу две вещи, которые я могу предположить, может быть проблемой, но я действительно не знаю:

  1. Я делаю все на localhost. Файл реестра имеет проверку на локальный хост и другое поведение, если мы находимся на локальном хосте.
  2. Структура папок отличается от игрушечного приложения. В игрушечном приложении index. js и index. html находятся в одной папке. В реальном приложении index. js находится в папке "sr c", а index. html - в папке "publi c". Оба "sr c" и "publi c" являются потомками одного и того же родителя. НО не ясно, как это можно изменить, поскольку я помню, что у do c этот индекс. js должен иметь точное имя файла и путь, и если я пытаюсь импортировать что-то вне папки, я получаю сообщение об ошибке, в котором говорится, что импорт вне папки не поддерживается.
...