joeshutt / version-polling Goto Github PK

View Code? Open in Web Editor NEW

93.0 93.0 15.0 54 KB

一个用于实时检测 web 应用更新的 JavaScript 库

License: MIT License

JavaScript 17.09% TypeScript 82.91%

version-polling's Introduction

Hi there 👋

🤔 编写高质量、可维护、易扩展的程序代码
✨ 开发3步走，测试->编码->重构

Github 统计

version-polling's People

Contributors

Stargazers

Watchers

Forkers

tammy000 weibozzz jinly2 songjingyang ddztomcat jxgahxs loveeazy lei9stone mu-l gitlfc163 ityufeng maizi zy715 hesitanting snowylchen

version-polling's Issues

js文件加载不出来

从昨天开始会频繁出现js文件加载不出来的问题，这个是因为什么额

Content-Encoding导致ETag变化

线上部署好后，第一次请求：

第二次请求：

由于Content-Encoding导致ETag变化，认为有更新，实际没有更新，这种情况如何避免？

通过 npm 引入写法项目报错运行不起来

在应用入口文件中代码如下：

import { createVersionPolling } from 'version-polling'
import { Button, notification, Space } from 'antd'

createVersionPolling({
  appETagKey: '__APP_ETAG__',
  pollingInterval: 5 * 1000, // 单位为毫秒
  silent: process.env.NODE_ENV === 'development', // 开发环境下不检测
  onUpdate: (self) => {
    notification.info({
      message: '页面有新的功能更新，请您点击确定按钮刷新查看～',
      btn: (
        <Space>
          <Button
            size="small"
            onClick={() => {
              notification.destroy()
              self.onCancel()
            }}
          >
            取消
          </Button>
          <Button
            type="primary"
            size="small"
            onClick={() => {
              notification.destroy()
              self.onRefresh()
            }}
          >
            确认
          </Button>
        </Space>
      ),
    })
  },
})

页面报错内容：

Uncaught Error: Module parse failed: Unexpected token (278:35)
You may need an appropriate loader to handle this file type.
|             _this.stop();
| 
>             _this.options.onUpdate?.(_this);
|           }
|         };
    at ./node_modules/.pnpm/[email protected]/node_modules/version-polling/dist/version-polling.js (value-equal.js:29:1)
    at __webpack_require__ (bootstrap:786:1)
    at fn (bootstrap:149:1)
    at Module.<anonymous> (index.css:45:1)
    at ./src/index.tsx (index.tsx:70:1)
    at __webpack_require__ (bootstrap:786:1)
    at fn (bootstrap:149:1)
    at 0 (utils.tsx:734:1)
    at __webpack_require__ (bootstrap:786:1)
    at checkDeferredModules (bootstrap:45:1)
    at Array.webpackJsonpCall

package.json 文件:

"react": "^17.0.1",
"webpack": "4.29.6",
"node": "v16.20.2",

基于vue-cli项目，在入口文件引用以后报缺少loader的错误

You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file.

关于onRefresh方法

查看源码如下：
onRefresh() {
window.location.reload();
}
window.location.reload();方法相当于浏览器正常刷新，如果出现重新打包的情况，还是会使用原来的缓存文件。使用window.location.reload(true);会不会好点，相当于清空缓存的刷新

Vue项目使用有什么需要注意的吗？

现在遇到两个问题：
1.页面不可见后，任务停止，页面恢复后会立即只执行一次，但是不会实时去执行了。
2.index.html 没有更新内容，但是等待 1 分钟左右，依然弹窗更新。
对于 Vue 这种SPA 单页应用。htmlFileUrl: ${location.origin},是否是需要这样配置？

fetch htmlFileUrl 状态码是404的时候，也会执行onUpdate回调

https://github.com/JoeshuTT/version-polling/blob/main/src/utils/index.ts#L40C33-L40C33

假定此时正在发版或者其它的操作，导致htmlFileUrl 不可访问，此时，从 const etag = response.headers.get("etag"); 中得到etag 为 null，与lastEtag 不等，会触发onUpdate回调

Import error

export 'createVersionPolling' (imported as 'createVersionPolling') was not found in 'version-polling'

轮询更新

在pollingInterval字段里设置时长为 60 * 60 * 1000的间隔时间，当发布新版本时会立刻发现版本更新，是我的时间设置问题还是一直在每秒进行轮询