Question

我通过create-react-pwa（CRP）工具创建应用程序，并将应用程序部署到本地IIS根路径。然后我在localhost打开Chrome。一切都运行良好，甚至服务工作者完成其工作，提取和缓存应用程序包和其他资源。在开发工具中，我单击应用程序选项卡中的添加到主屏幕按钮，然后添加一个快捷方式。

将根路径更改为子文件夹（localhost / myapp）时出现问题。当然，我在package.json和manifest.json

中更改了CRP设置并编辑了主页

<script>
    "serviceWorker" in navigator && window.addEventListener("load", function () {
        navigator.serviceWorker.register("/myapp/service-worker.js")
    })
</script>

然后我构建应用程序并在index.html中编辑service-worker的路径

Site cannot be installed: no matching service worker detected. You may need to reload the page, or check that the service worker for the current page also controls the start URL from the manifest

我将此版本部署到名为“/ myapp”的IIS子文件夹，并尝试在Chrome中检查结果。一切运作良好，服务工作者的工作。但是当我尝试添加到主屏幕时，它失败了。 Chrome会显示以下错误：

/wwwroot
  /myapp
    /static
    /index.html
    /manifest.json
    /service-worker.js
    / etc...

请有人知道出了什么问题？

构建结构：

risk_accum <- structure(list(date = structure(c(1465948800, 1465952400, 1465956000, 
                              1465959600, 1465963200, 1465966800, 1465970400, 1465974000, 1465977600, 
                              1465981200, 1465984800, 1465988400, 1465992000, 1465995600, 1465999200, 
                              1466002800, 1466006400, 1466010000, 1466013600, 1466017200, 1466020800, 
                              1466024400, 1466028000, 1466031600, 1466035200, 1466038800, 1466042400, 
                              1466046000, 1466049600, 1466053200, 1466056800, 1466060400, 1466064000, 
                              1466067600, 1466071200, 1466074800, 1466078400, 1466082000, 1466085600, 
                              1466089200, 1466092800, 1466096400, 1466100000, 1466103600, 1466107200, 
                              1466110800, 1466114400, 1466118000, 1466121600, 1466125200, 1466128800, 
                              1466132400, 1466136000, 1466139600, 1466143200, 1466146800, 1466150400, 
                              1466154000, 1466157600, 1466161200, 1466164800, 1466168400, 1466172000, 
                              1466175600, 1466179200, 1466182800, 1466186400, 1466190000, 1466193600, 
                              1466197200, 1466200800, 1466204400, 1466208000, 1466211600, 1466215200, 
                              1466218800, 1466222400, 1466226000, 1466229600, 1466233200, 1466236800, 
                              1466240400, 1466244000, 1466247600, 1466251200, 1466254800, 1466258400, 
                              1466262000, 1466265600, 1466269200, 1466272800, 1466276400, 1466280000, 
                              1466283600, 1466287200, 1466290800, 1466294400, 1466298000, 1466301600, 
                              1466305200, 1466308800, 1466312400, 1466316000, 1466319600, 1466323200, 
                              1466326800, 1466330400, 1466334000, 1466337600, 1466341200, 1466344800, 
                              1466348400, 1466352000, 1466355600, 1466359200, 1466362800, 1466366400, 
                              1466370000, 1466373600, 1466377200), class = c("POSIXct", "POSIXt"
                              ), tzone = "UTC"), risk = c(NA, NA, NA, 1, 2, 3, 4, 5, 6, NA, 
                                                          NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, 
                                                          NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, 1, 2, 3, NA, NA, NA, 
                                                          NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, 
                                                          NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, 
                                                          NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, 
                                                          NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, NA, 1, 2, 3, 
                                                          4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, NA, NA)), .Names = c("date", 
                                                                                                                         "risk"), row.names = c(NA, -120L), class = c("tbl_df", "tbl", 
                                                                                                                                                                      "data.frame"))

Answer 1

除了一件事之外，您似乎已经完成了所有事情 - 在注册时没有定义服务工作者的范围。所以你可以尝试两件事：

1.尝试在注册时明确添加服务工作者的范围。在按照选项2中所述进行更大努力之前，请检查这是否适合您。代码：

<script>
    "serviceWorker" in navigator && window.addEventListener("load", function () {
        navigator.serviceWorker.register('/myapp/service-worker.js', { scope : '/myapp/' })
    })
</script>

2.完全证明方式就是这个。由于您使用的是IIS，因此可以对web.config文件进行更改，以将Service-Worker-Allowed Http标头添加到服务工作文件的响应中。代码：

<location path="/myapp/service-worker.js">
    <system.webServer>
        <httpProtocol>
            <customHeaders>
                <add name="Service-Worker-Allowed" value="/" />
            </customHeaders>
        </httpProtocol>
    </system.webServer>
</location>

然后在注册服务工作者时将范围定义为{scope : '/'}。这样，无论您的项目结构或服务工作者的位置如何，它都应该有效。基本上你现在正在做的是你正在添加＆＃34; Service-Worker-Allowed＆＃34; HTTP响应中的标头service worker's script resource request。这个答案的灵感来自上面服务工作者规范链接中的示例10。

如何使用嵌套主页（localhost / app）配置create-react-pwa

1 个答案: