Reactjs 在ASP.net react应用程序中为渐进式web应用程序注册服务工作者

作为一个玩具项目，我用CreateReact应用程序创建了一个react web应用程序。然后，我将index.js中的“serviceworker.unregister（）”更改为“serviceworker.register（）”。玩具项目位于Github上的以下位置：。然后，我通过两种不同的方式启动应用程序，尝试了谷歌的lighthouse审计

如果我用“npm启动”启动它，lighthouse会对一些事情感到不高兴。我目前感兴趣的三个方面如下：

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复制到我的浏览器中，lighthouse会抱怨只使用https

现在是真正的项目。真正的项目是netcoreapp3.0 react应用程序。目前，它本质上是微软的模板项目。它有一个文件index.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();

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);
      }
    });
  }
}```

问题是，在我尝试过的每种情况下，行为都与玩具应用程序的“调试”版本相同。这包括项目的调试和发布版本。灯塔似乎看不见服务人员。我认为有两件事可能是问题所在，但我真的不知道：

我在本地主机上做所有事情。如果我们在localhost上，注册文件会检查localhost和不同的行为

文件夹结构与玩具应用程序不同。在玩具应用程序中，index.js和index.html位于同一文件夹中。在真正的应用程序中，index.js位于文件夹“src”中，而index.html位于文件夹“public”中。“src”和“public”都是同一父级的子级。但我不清楚这会如何改变，因为我记得看到一个index.js应该有确切的文件名和路径的文档，如果我尝试在文件夹外导入某些内容，我会收到一个错误，说不支持在文件夹外导入

---

你找到答案了吗？我也在尝试做同样的事情。运气不好你找到答案了吗？我也在尝试做同样的事情。还没有运气