javascript - 部署到 firebase 托管的 ReactJS 应用程序在首次部署后未更新

标签 javascript reactjs firebase command-line-interface firebase-hosting

希望大家一切顺利并保持安全。

我一直在尝试使用 firebase 将我的 React 应用程序部署到网络上,一切都很顺利,直到我尝试更新/重新部署它。它在我的终端中显示 ✔ 部署完成! 但我检查了网站,它显示没有更新。我尝试将以下代码放入 firebase.json 中:

"headers": [
      {
        "source": "/service-worker.js",
        "headers": [
          {
            "key": "Cache-Control",
            "value": "no-cache"
          }
        ]
      }
    ]

但这并没有改变任何事情。我发布该应用程序的步骤如下:

npx create-react-app firebase-test
cd firebase-test
firebase login
firebase init #I only chose hosting, chose to configure as a single-page application, wrote build as my public folder
npm run build
firebase deploy

它显示了第一次部署,但是当我尝试再次部署时,我没有看到任何更新。

最佳答案

您的 service-worker.js 可能仍被缓存,因为您在首次访问该网站后添加了 Cache-Control header 。

这意味着您的浏览器没有尝试再次请求该文件,而是从内存中提供该文件。即使标准刷新 (CTRL/CMD + R) 也无济于事。

尝试硬刷新 (CTRL+Shift+R),或在开发人员工具中手动清除应用程序的缓存。您的浏览器将使用正确的 Cache-Control header 重新下载 service-worker.js,并且问题不会再次出现。

并且,一如既往,确保在部署之前实际构建应用程序:)

关于javascript - 部署到 firebase 托管的 ReactJS 应用程序在首次部署后未更新,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/62069931/

相关文章:

javascript - 我们如何在 webgl 的两个 Canvas 中显示相同的对象?

javascript - 获取下拉列表中选定的值并将其放入其他下拉列表中?

javascript - 如何在函数内返回函数并返回显示

javascript - 尝试将 react-bootstrap carousel 转换为 es6 和 redux

ios - Firebase Podfile - CocoaPods 无法更新

android - 如何使用这两个函数在 Firebase- Android 上监听数据

javascript - 为什么在运行时添加 <script> 标签不会加载 javascript 文件? (与 react .js)

javascript - vue条件显示

javascript - 单击 react 时更改按钮图标

javascript - 如何查询不同节点的置顶帖子?