是否可以直接从 React PWA 中的地址栏访问 Web 服务？答案

【问题标题】：Is it possible to access web services directly from address bar in React PWA?是否可以直接从 React PWA 中的地址栏访问 Web 服务？
【发布时间】：2020-08-20 03:38:02
【问题描述】：

我正在开发一个已转换为 PWA 的 React Web 应用程序，它运行良好。但是，当我尝试通过在浏览器的地址栏中键入直接调用 Web 服务（类似于 https://www.somewebsite.com/api/someController?parametersHere）时，它会返回一个空白屏幕并且什么也没有发生。我是否需要更改清单中的某些内容或添加一些侦听器以绕过阻止具有“/api/”的路由触发 Web 服务的侦听器？

我正在阅读清单，我在其中添加了一个范围，但不确定应该是什么样子，但以如下方式添加它会在浏览器控制台的“应用程序”选项卡中呈现一些警告。

{
  "short_name": "MyApp",
  "name": "MyApp",
  "icons": [
    {
      "src": "logo.png",
      "sizes": "192x192",
      "type": "image/png",
      "purpose": "maskable any"
    }
  ],
  "start_url": "/",
  "display": "standalone",
  "theme_color": "#000000",
  "background_color": "#ffffff",
  "scope": "/api/"
}

它导致了这个警告。

我还在 react-router-dom 中添加了一个路由，它会监听“/api/”以防万一，但它也没有任何效果。

【问题讨论】：

标签： reactjs progressive-web-apps react-router-dom

【解决方案1】：

我仍然没有找到问题的主要原因，但我确实找到了解决该问题的方法。首先，我在 routes.tsx 中添加了一个新的 Route 组件，它将调用另一个 React 组件，在该组件中我通过 redux-saga 触发了 Web 服务调用。

【讨论】：