如何用实现skipWaiting？
如何用实现skipWaiting？
提问于 2018-10-20 09:54:39
我希望用户能够在新的服务人员可用并等待时立即进行更新？我已经能够显示一个弹出时，新的更新是可用的，但我想添加一个按钮，以强制更新现场。我知道这可以通过调用skipWaiting来实现，但不确定如何使用来实现它。有人能做到这一点吗？会很感激你的帮助。谢谢!
回答 6
Stack Overflow用户
回答已采纳
发布于 2018-10-26 06:04:33
我使用了一个名为https://github.com/bbhlondon/cra-append-sw的包来附加以下代码来调用触发器skipWaiting：
self.addEventListener('message', event => {
if (event.data === 'skipWaiting') {
self.skipWaiting();
}
});Stack Overflow用户
发布于 2019-10-28 19:05:52
现在的CRA build\service-worker.js文件(v3加号)包含处理skipWaiting的代码。
self.addEventListener('message', (event) => {
if (event.data && event.data.type === 'SKIP_WAITING') {
self.skipWaiting();
}
});在serviceWorker.js中调用的寄存器函数index.js文件现在接受一个配置参数：
serviceWorker.register({
onUpdate: registration => {
const waitingServiceWorker = registration.waiting
if (waitingServiceWorker) {
waitingServiceWorker.addEventListener("statechange", event => {
if (event.target.state === "activated") {
window.location.reload()
}
});
waitingServiceWorker.postMessage({ type: "SKIP_WAITING" });
}
}
});一旦应用了更新，这将跳过等待，然后刷新页面。
Stack Overflow用户
发布于 2019-05-02 17:58:31
在serviceWorker.js文件中可以找到以下代码
if (config && config.onUpdate) {
config.onUpdate(registration);
}因此，实现config.onUpdate功能
创建一个文件swConfig.js
export default {
onUpdate: registration => {
registration.unregister().then(() => {
window.location.reload()
})
},
onSuccess: registration => {
console.info('service worker on success state')
console.log(registration)
},
}在index.js将实现函数发送给serviceWorker
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import * as serviceWorker from './serviceWorker';
import swConfig from './swConfig'
ReactDOM.render(<App />,
document.getElementById('root'));
serviceWorker.register(swConfig);看看这个回购pwaupdate
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/52904430
复制相关文章
相似问题
腾讯云开发者
