当前位置: 首页 > news >正文

前端发版(发包)缓存,需要强制刷新问题处理

问题原因: 浏览器问题

一、创建初始版本文件(public/version.json)

{ "version": "1722240835844" }

二、设置版本判断(version.js)

import axios from "axios";const isNewVersion = () => {let baseUrl = `/version.json?t=${new Date().getTime()}`;axios.get(baseUrl).then((res) => {if (res.status === 200) {let webappVersion = res.data.version;//当前项目发布的版本let localWebappVersion = localStorage.getItem("webappVersion");//缓存中的版本if (localWebappVersion && localWebappVersion != webappVersion) {// 如果没有缓存版本 或者 缓存版本与当前项目发布版本不一致时 强行刷新localStorage.setItem("webappVersion", webappVersion);window.location.reload();return;} else {localStorage.setItem("webappVersion", webappVersion);}}});
};
export default isNewVersion;

三、设置全局监听(main.js. permission.js)

router.beforeEach((to, from, next) => {//判断当前代码版本是否与服务器中代码版本一致,如不一致则刷新页面获取最新isNewVersion(); 
});

四、生成打包版本(vite.config.js)

  1. 引入变量
    const path = require("path");const fs = require("fs");
  1. 生成版本代码
	// 如果当前时打包行为 生成最新版本号if (command == "build") {//打包时生成版本号let version = {version: JSON.stringify(new Date().getTime()),};fs.writeFile("./public/version.json", JSON.stringify(version), () => {console.log("新版本号生成成功", version);});}

相关文章:

前端发版(发包)缓存,需要强制刷新问题处理

问题原因: 浏览器问题 一、创建初始版本文件(public/version.json) { "version": "1722240835844" }二、设置版本判断(version.js) import axios from "axios";const isNewVersion () > {let baseUrl …...

洛谷练习(8.4/8.5)

题目 P2036 PERKET题目描述思路代码 P3799 小 Y 拼木棒题目描述思路代码 P1010 幂次方题目描述思路代码 P1498 南蛮图腾题目描述思路代码 P1928 外星密码题目描述思路代码 P2036 PERKET 题目描述 比较苦度和酸度的最小差值 思路 搜索最小差值 代码 void dfs(int sd,int k…...

DLMS/COSEM中的信息安全:加密算法(下)1

4.公钥算法 4.1概述 一般来说,公钥密码系统使用难以解决的问题作为算法的基础。RSA算法基于非常大的整数的素因子分解。椭圆曲线密码学(ECC)是基于求解椭圆曲线离散对数问题(ECDLP)的难度。与RSA相比,ECC提供了相似的安全级别,但密钥大小明显减少。ECC特别适用于嵌入式…...

ES6中的Promise、async、await,超详细讲解!

Promise是es6引入的异步编程新解决方案,Promise实例和原型上有reject、resolve、all、then、catch、finally等多个方法,语法上promise就是一个构造函数,用来封装异步操作并可以获取其成功或失败的结果,本篇文章主要介绍了ES6中的P…...

Modbus poll和Modbus Mbslave的使用

读取Modbus Mbslave中的数据 首先创建COM1和COM2端口 然后 using System.IO.Ports; ​ namespace 通信 {internal class Program{static void Main(string[] args){Console.WriteLine("Hello, World!");SerialPort serialPort new SerialPort("COM1",960…...

树莓集团的全球化征程:数字媒体产业的本土与国际布局

在全球数字化转型的浪潮中,树莓集团正稳步推进数字媒体产业从本土到国际的全球化布局。在数字媒体产业这一新兴且充满活力的领域中,树莓集团不仅在国内市场树立了标杆,更以其独特的全球化战略布局,引领着行业的未来趋势。 本土深耕…...

LeetCode面试150——274H指数

题目难度:中等 默认优化目标:最小化平均时间复杂度。 Python默认为Python3。 目录 1 题目描述 2 题目解析 3 算法原理及代码实现 3.1 排序 3.2 排序时间优化(计数排序) 3.3 二分查找 参考文献 1 题目描述 给你一个整数数组 citations &#xf…...

【Linux】Linux重定向指南:探索输出重定向与追加重定向的奥秘!

欢迎来到 CILMY23 的博客 🏆本篇主题为:Linux重定向指南:探索输出重定向与追加重定向的奥秘! 🏆个人主页:CILMY23-CSDN博客 🏆系列专栏:Python | C | C语言 | 数据结构与算法 | 贪…...

Spring AI -快速开发ChatGPT应用

Spring AI介绍 Spring AI是AI工程师的一个应用框架,它提供了一个友好的API和开发AI应用的抽象,旨在简化AI应用的开发工序,例如开发一款基于ChatGPT的对话、图片、音频等应用程序。 Spring AI已经集成了OpenAI的API,因此我们不需…...

Modern C++ 智能指针

Why? 原始指针存在缺陷,不符合现代编程语言的需要。 原始指针的缺陷: 指针指向一片内存,使用者无法得知到底是指向了什么,是数组还是对象?使用完指针是否需要销毁?什么时候销毁?如…...

Python的100道经典练习题,每日一练,必成大神!!!

Python的100道经典练习题是一个广泛而深入的学习资源,可以帮助Python初学者和进阶者巩固和提升编程技能 完整的100多道练习题可在下面图片免沸获取哦~ 整理了100道Python的题目,如果你是一位初学者,这一百多道题可以 帮助你轻松的使用Python…...

代码回滚命令

定位到当前分支 git branch回滚到指定的commit git reset --hard 85da0cb8322accad143cpush到远程分支 git push --force...

[ASIS 2019]Unicorn shop1

打开题目 随便输入信息看一下 操作失败,只让输入一个字符 不妨抓包看一下,信息,发现 从中可以发现源代码是如何处理price的 使用的是unicodedata.numeric() 但我们查看页面源码时,看到源码处理方式是utf-8 所以,前…...

LangChain与泛型编程:探索代码生成的新维度

LangChain与泛型编程:探索代码生成的新维度 在软件开发领域,泛型编程是一种允许创建可重用组件的技术,这些组件可以在多种数据类型上工作的编程范式。LangChain作为一个假设的编程辅助工具,如果存在,它可能会支持泛型…...

day25

一、进程间通信(IPC) 1.1 进程间通信的引入 1> 对于多个线程之间通信,我们可以使用临界资源来完成,通过一个线程任务对临界资源进行修改,另一个线程也可以使用已经修改过的临界资源,但是要注意使用…...

红黑树的概念和模拟实现[C++]

文章目录 红黑树的概念一、红黑树的性质红黑树原理二、红黑树的优势和比较 红黑树的模拟实现构建红黑树的数据结构定义节点的基本结构和初始化方式插入新节点插入新节点的颜色调整颜色和结构以满足红黑树性质 红黑树的应用场景 红黑树的概念 一、红黑树的性质 红黑树是一种自平…...

网络安全应急响应概述

前言 在网络安全领域,有一句广为人知的话:“没有绝对的安全”。这意味着任何系统都有可能被攻破。安全攻击的发生并不可怕,可怕的是从头到尾都毫无察觉。当系统遭遇攻击时,企业的安全人员需要立即进行应急响应,以将影响…...

【C++】链表操作技巧综合:重排链表(带你理顺链表的做题思路)

1.题目 2.算法思路 这是一道关于链表的综合题,一共涉及到三个步骤,其中每个步骤单拎出来就可以当一道单独的题目。所以需要大家对链表的操作十分熟悉,否则可能需要大量的时间做这道题目,而且还要很多的bug。 第一个步骤&#xf…...

行为型设计模式2:观察者/职责链/中介者/访问者

设计模式:观察者/职责链/中介者/访问者 (qq.com)...

叛逆,批判

1、对以往说法的批判之一(第一次这么公开批判是2004-2005年): 这部英文版的《数学百科全书》似乎是从俄语版翻译过来的?我查了三本引用的图书文献,都没有关于“nonsingular”和“singular”的类似下面的说法&#xff…...

【Python】 -- 趣味代码 - 小恐龙游戏

文章目录 文章目录 00 小恐龙游戏程序设计框架代码结构和功能游戏流程总结01 小恐龙游戏程序设计02 百度网盘地址00 小恐龙游戏程序设计框架 这段代码是一个基于 Pygame 的简易跑酷游戏的完整实现,玩家控制一个角色(龙)躲避障碍物(仙人掌和乌鸦)。以下是代码的详细介绍:…...

TDengine 快速体验(Docker 镜像方式)

简介 TDengine 可以通过安装包、Docker 镜像 及云服务快速体验 TDengine 的功能,本节首先介绍如何通过 Docker 快速体验 TDengine,然后介绍如何在 Docker 环境下体验 TDengine 的写入和查询功能。如果你不熟悉 Docker,请使用 安装包的方式快…...

DeepSeek 赋能智慧能源:微电网优化调度的智能革新路径

目录 一、智慧能源微电网优化调度概述1.1 智慧能源微电网概念1.2 优化调度的重要性1.3 目前面临的挑战 二、DeepSeek 技术探秘2.1 DeepSeek 技术原理2.2 DeepSeek 独特优势2.3 DeepSeek 在 AI 领域地位 三、DeepSeek 在微电网优化调度中的应用剖析3.1 数据处理与分析3.2 预测与…...

React Native 开发环境搭建(全平台详解)

React Native 开发环境搭建(全平台详解) 在开始使用 React Native 开发移动应用之前,正确设置开发环境是至关重要的一步。本文将为你提供一份全面的指南,涵盖 macOS 和 Windows 平台的配置步骤,如何在 Android 和 iOS…...

在 Nginx Stream 层“改写”MQTT ngx_stream_mqtt_filter_module

1、为什么要修改 CONNECT 报文? 多租户隔离:自动为接入设备追加租户前缀,后端按 ClientID 拆分队列。零代码鉴权:将入站用户名替换为 OAuth Access-Token,后端 Broker 统一校验。灰度发布:根据 IP/地理位写…...

Neo4j 集群管理:原理、技术与最佳实践深度解析

Neo4j 的集群技术是其企业级高可用性、可扩展性和容错能力的核心。通过深入分析官方文档,本文将系统阐述其集群管理的核心原理、关键技术、实用技巧和行业最佳实践。 Neo4j 的 Causal Clustering 架构提供了一个强大而灵活的基石,用于构建高可用、可扩展且一致的图数据库服务…...

unix/linux,sudo,其发展历程详细时间线、由来、历史背景

sudo 的诞生和演化,本身就是一部 Unix/Linux 系统管理哲学变迁的微缩史。来,让我们拨开时间的迷雾,一同探寻 sudo 那波澜壮阔(也颇为实用主义)的发展历程。 历史背景:su的时代与困境 ( 20 世纪 70 年代 - 80 年代初) 在 sudo 出现之前,Unix 系统管理员和需要特权操作的…...

C++_哈希表

本篇文章是对C学习的哈希表部分的学习分享 相信一定会对你有所帮助~ 那咱们废话不多说,直接开始吧! 一、基础概念 1. 哈希核心思想: 哈希函数的作用:通过此函数建立一个Key与存储位置之间的映射关系。理想目标:实现…...

WEB3全栈开发——面试专业技能点P7前端与链上集成

一、Next.js技术栈 ✅ 概念介绍 Next.js 是一个基于 React 的 服务端渲染(SSR)与静态网站生成(SSG) 框架,由 Vercel 开发。它简化了构建生产级 React 应用的过程,并内置了很多特性: ✅ 文件系…...

一些实用的chrome扩展0x01

简介 浏览器扩展程序有助于自动化任务、查找隐藏的漏洞、隐藏自身痕迹。以下列出了一些必备扩展程序,无论是测试应用程序、搜寻漏洞还是收集情报,它们都能提升工作流程。 FoxyProxy 代理管理工具,此扩展简化了使用代理(如 Burp…...