如何检查更新React PWA应用程序
#javascript #react #pwa

首先,打开您的文件ServiceWorkerRegration

找到此功能

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 run build

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

运行命令

npm run build

然后,如果出现了弹出警报

祝贺您的React PWA应用已检查更新。