前端--导致页面白屏的原因

编程知识 更新时间:2023-05-03 01:18:47
  1. JS问题
    常用框架Vue React Angular都是依靠JS进行驱动, 并且单页面的应用html也是依靠JS生成,在渲染页面的时候需要加载很大的JS文件,在JS解析加载完成之前无法展示页面,从而导致了白屏。

  2. 浏览器兼容问题
    vue代码在ie中显示白屏

  3. URL 网址无效或者含有中文字符

  4. 缓存导致
    vue项目打包后,在非首次线上替换dist文件时,某些手机/浏览器在之后首次打开页面,可能出现白屏情况

原因:在用户端会默认缓存index.html入口文件,而由于vue打包生成的css/js都是哈希值,跟上次的文件名都不同,因此会出现找不到css/js的情况,导致白屏的产生。在服务端更新包之后,由于旧的文件被删除,而index.html所链接的路径依然是旧文件路径,因此会找不到文件,从而白屏。

解决方案一般是强制刷新页面或者清除缓存重新加载。
(1) 直接在网站后台清除缓存,(2) 在后台无法清理的情况下,我们可以直接删除缓存文件。连接FTP,找到home/cache文件夹,然后进入里面删除cachedata.php

参考网站:
https://blog.csdn/yeyinfan123/article/details/107206247/?utm_medium=distribute.pc_relevant.none-task-blog-2defaultbaidujs_baidulandingword~default-1.essearch_pc_relevant&spm=1001.2101.3001.4242

https://mayouchen.blog.csdn/article/details/79214773?utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7ECTRLIST%7Edefault-1.essearch_pc_relevant&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7ECTRLIST%7Edefault-1.essearch_pc_relevant

https://blog.csdn/weixin_43912756/article/details/108354495?utm_medium=distribute.pc_relevant.none-task-blog-2defaultbaidujs_title~default-0.essearch_pc_relevant&spm=1001.2101.3001.4242

更多推荐

前端--导致页面白屏的原因

本文发布于:2023-04-29 20:24:00,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/414dda7646d2d78be8ada99640b17fa1.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:原因   页面

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!

  • 112088文章数
  • 28531阅读数
  • 0评论数