前端独立实现页面是否有发布

1、自动更新js (AutoUpdate.js)

javascript 复制代码
import { Modal } from "antd"

let lastSrcs;
const scriptReg = /\<script.*src=["'](?<src>[^"']+)/gm;
async function extractNewScripts() {
    const html = await fetch('/?_timnestamp=' + Date.now()).then(res => {
        return res.text();
    })
    scriptReg.lastIndex = 0;
    let result = [];
    let match;
    console.log(html)
    while ((match = scriptReg.exec(html))) {
        result.push(match.groups.src)
    }
    return result;
}

async function needUpdate() {
    const newScripts = await extractNewScripts();
    if (!lastSrcs) {
        lastSrcs = newScripts
        return false;
    }
    let result = false;
    if (lastSrcs.length !== newScripts.length) {
        result = true;
    }
    for (let i = 0; i < lastSrcs.length; i++) {
        if (lastSrcs[i] !== newScripts[i]) {
            result = true;
            break;
        }
    }
    lastSrcs = newScripts;
    return result
}

const duration = 5000;
function autoRefresh() {
    setTimeout(async () => {
        const willUpdate = await needUpdate();
        if (willUpdate) {
            Modal.success({
                content: '当前系统有更新,请刷新',
                keyboard: false,
                onOk: () => {
                    location.reload(true);
                }
            });
        }
        autoRefresh();
    }, duration)
};
autoRefresh();

2、修改webpack出口打包文件名称

3、引入AutoUpdate.js

javascript 复制代码
import './util/AutoUpdate';
相关推荐
初心未改HD2 分钟前
gRPC 与 Protobuf 实战指南
开发语言·golang
Jul1en_9 分钟前
Claude 迁移 Codex 工作流迁移与更新
java·服务器·前端·后端·ai编程
Heo11 分钟前
14_React 中的更新队列 updateQueue
前端·javascript·面试
前端 贾公子17 分钟前
解决浏览器端 globalThis is not defined 报错
前端·javascript·vue.js
宁雨桥20 分钟前
前端与AI结合实战分享
前端·人工智能
2zcode25 分钟前
基于MATLAB的交通流量预测模型设计与实现
开发语言·matlab·交通流量预测
早日退休!!!28 分钟前
操作系统锁
java·开发语言
lsx20240629 分钟前
Python 统计学基础与高级应用
开发语言
研究点啥好呢31 分钟前
快手多模态算法工程师面试题精选:10道高频考题+答案解析
java·开发语言·人工智能·ai·面试·笔试
xxjj998a31 分钟前
PHP vs C#:核心差异全解析
开发语言·c#·php