如何检查更新反应 PWA 应用

首先,打开您的文件服务工人注册

查找此函数

function registerValidSW(swUrl, config) {
  navigator.serviceWorker
    .register(swUrl)
    .then((registration) => {

并在注册之前添加以下代码。

// Check for updates at start.     
registration.update();     
// Check for updates every 5 min.      
setInterval(() => {        
registration.update();        
console.log("Checked for update...");      
}, (1000 * 60) * 5);

然后成为

function registerValidSW(swUrl, config) {
  navigator.serviceWorker
    .register(swUrl)
    .then((registration) => {

      // Check for updates at start.     
      registration.update();     
      // Check for updates every 5 min.      
      setInterval(() => {        
        registration.update();        
        console.log("Checked for update...");      
      }, (1000 * 60) * 5);

第二个,也是最后一个发现if (config && config.onUpdate) {

添加警报以检查是否将是更新
警报(“更新可用!要更新,请关闭所有窗口并重新打开“);

代码将是

alert("Update available! To update, close all windows and reopen");

// Execute callback
if (config && config.onUpdate) {
    config.onUpdate(registration);
}

运行以下命令:

npm 运行构建

在服务器中运行您的应用程序并测试其工作与否,
然后编辑一些代码

运行命令

npm 运行构建

然后,如果有弹出警报显示

恭喜您的反应 PWA 应用程序已检查更新。

猜你喜欢

转载自blog.csdn.net/liuhao9999/article/details/130014011
PWA