码农知识堂 - 1000bd
  •   Python
  •   PHP
  •   JS/TS
  •   JAVA
  •   C/C++
  •   C#
  •   GO
  •   Kotlin
  •   Swift
  • vue3项目到React 的nextjs项目的改版升级后,网站不更新,如何清理缓存,让改版后的网站生效?


    问题描述:从vue3项目到React 的nextjs项目的改版升级后,域名不变的情况下访问项目,发现访问到的还是vue3项目、而不是重新部署后的nextjs项目,接着强制刷新界面,到了nextjs改版后的项目,接着鼠标焦点放到浏览器输入框选中后回车后发现又回到了老的vue3项目,上述步骤一直重复,浏览器开发者窗口查看network,发现网络请求的服务为server worker,之后借鉴网上相关server worker卸载相关文档得以解决。(vue3项目中使用了pwa配置)

    本人nextjs 项目中的处理方式如下:

    在_app,tsx文件中使用useEffect hock函数

    如此情况部署后,老用户访问网站如果还是老的网站,需要强制刷新一次,server worker就会被清除,后面的访问都会是新改版的网站不会是改版之前的网站。
    处理问题参考blob有:
    从React切换到Next.js后,由于服务工作者的缓存,网站不会刷新。如何强制更新?icon-default.png?t=M85Bhttps://cloud.tencent.com/developer/ask/sof/975992如何正确地卸载Service Worker?_yyck的博客-CSDN博客_禁用serviceworker如何正确地卸载Service Worker?以下链接, Google Developers Service Worker工作原理:https://developers.google.com/web/fundamentals/primers/service-workers/lifecycle#updates但是假如某一天你网站不需要 Service Worker,如何正确地卸载呢?以下以...https://blog.csdn.net/iiicai/article/details/81150347?ops_request_misc=%257B%2522request%255Fid%2522%253A%2522166452596216782390573565%2522%252C%2522scm%2522%253A%252220140713.130102334..%2522%257D&request_id=166452596216782390573565&biz_id=0&utm_medium=distribute.pc_search_result.none-task-blog-2~all~baidu_landing_v2~default-2-81150347-null-null.142^v51^control,201^v3^control_1&utm_term=vue3%20%E5%88%A0%E9%99%A4service-worker&spm=1018.2226.3001.4187React、Vue等前端项目彻底卸载ServiceWorker,亲测有效_DougLeaMrConcurrency的博客-CSDN博客前端项目遇到的问题每次前端项目在本地开发没事,一旦发布到线上就需要用户手动清理浏览器缓存,让用户总是吐槽,百度搜了很多文章都没找到解决方案,最终在钉钉源码中找到了解决方案。话不多说,直接上图:1、判断Service Worker是否被安装以谷歌浏览器为例:打开浏览器-开发者模式,进入Network,选择Doc看到Status Code后面有 (from service worker)说明ServiceWorker没有被卸载。2、卸载Service-Worker话不多说,开始卸载:2.1找到前https://blog.csdn.net/qq_43265673/article/details/118676527?ops_request_misc=%257B%2522request%255Fid%2522%253A%2522166452596216782390573565%2522%252C%2522scm%2522%253A%252220140713.130102334..%2522%257D&request_id=166452596216782390573565&biz_id=0&utm_medium=distribute.pc_search_result.none-task-blog-2~all~baidu_landing_v2~default-1-118676527-null-null.142^v51^control,201^v3^control_1&utm_term=vue3%20%E5%88%A0%E9%99%A4service-worker&spm=1018.2226.3001.4187

    以上仅供参考:有问题,或更好建议,请下方留言,谢谢🙏 !!!

     

  • 相关阅读:
    信息系统项目管理师第四版学习笔记——组织通用管理
    快门图像传感器技术
    MIPI CSI-2笔记(10) -- Low Level Protocol(延迟降低、传输效率增强特性LRTE)
    2024.6.15 英语六级 经验与复盘
    5‘-荧光素氨基磷酸酯,CAS号: 204697-37-0
    19.Spring源码解读之简单手写spring框架
    汇编语言与微机原理 期末半开卷复习整理(上)
    Python(1)——如何配置pip私有源
    全网最全:Mysql六种约束详解
    关于Flask高级_钩子函数的介绍和使用
  • 原文地址:https://blog.csdn.net/zwt_guiji/article/details/127125718
  • 最新文章
  • 攻防演习之三天拿下官网站群
    数据安全治理学习——前期安全规划和安全管理体系建设
    企业安全 | 企业内一次钓鱼演练准备过程
    内网渗透测试 | Kerberos协议及其部分攻击手法
    0day的产生 | 不懂代码的"代码审计"
    安装scrcpy-client模块av模块异常,环境问题解决方案
    leetcode hot100【LeetCode 279. 完全平方数】java实现
    OpenWrt下安装Mosquitto
    AnatoMask论文汇总
    【AI日记】24.11.01 LangChain、openai api和github copilot
  • 热门文章
  • 十款代码表白小特效 一个比一个浪漫 赶紧收藏起来吧!!!
    奉劝各位学弟学妹们,该打造你的技术影响力了!
    五年了,我在 CSDN 的两个一百万。
    Java俄罗斯方块,老程序员花了一个周末,连接中学年代!
    面试官都震惊,你这网络基础可以啊!
    你真的会用百度吗?我不信 — 那些不为人知的搜索引擎语法
    心情不好的时候,用 Python 画棵樱花树送给自己吧
    通宵一晚做出来的一款类似CS的第一人称射击游戏Demo!原来做游戏也不是很难,连憨憨学妹都学会了!
    13 万字 C 语言从入门到精通保姆级教程2021 年版
    10行代码集2000张美女图,Python爬虫120例,再上征途
Copyright © 2022 侵权请联系2656653265@qq.com    京ICP备2022015340号-1
正则表达式工具 cron表达式工具 密码生成工具

京公网安备 11010502049817号