[vue]打包后发布相关问题总结

问题1:

1. history模式下,发布到nginx后,刷新页面或者地址栏回车404问题。

打开nginx的nginx.conf文件,添加注释【2】对应行的代码,可以解决这个问题。

events {worker_connections  1024;
}http {include mime.types; #【1】default_type application/octet-stream; #【1】server {listen       9003;server_name  localhost;#支持跨域cors    add_header Access-Control-Allow-Origin *;location / {root   dist;index  index.html index.htm;try_files $uri $uri/ /index.html; #【2】}}
}

2. vue打包发布到nginx后,可以成功请求到css,但是样式没有被应用问题。

碰到这种情况,先打开浏览器控制台,到network panel,然后找到请求的css,然后看一下响应里面的content-type是不是text/plain,如果是就说明不对,应该是text/css才对。针对这个情况,同样是打开nginx.conf文件,将上面注释【1】中的内容粘贴上即可。

问题2:

vue路由为history模式,打包后,放到springboot后,启动springboot进入到页面后,刷新页面404问题。

原因:使用history模式,刷新页面后,浏览器会使用url去springboot中找对应的controller映射或者把url当做一个静态资源去查找,如果找不到就会返回404.(hash模式下刷新是找页面中对应的锚点中的内容显示,所以不会想springboot发起新的请求,就不会出现404问题)

解决方式:刷新后让404引导到index.html就行了。代码如下:

@Configuration
public class WebConfig {@Beanpublic WebServerFactoryCustomizer<ConfigurableWebServerFactory> myWebServerFactoryCustomizer(){return new WebServerFactoryCustomizer<ConfigurableWebServerFactory>() {@Overridepublic void customize(ConfigurableWebServerFactory factory) {ErrorPage error404Page = new ErrorPage(HttpStatus.NOT_FOUND, "/index.html");factory.addErrorPages(error404Page);}};}
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/861616.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

6.18-6.26 旧c语言

第一章 概述 32关键字 9种控制语句 优点&#xff1a;能直接访问物理地址&#xff0c;位操作&#xff0c;代码质量高&#xff0c;执行效率高 可移植性好 面向过程&#xff1a;以事件为中心 面向对象&#xff1a;以实物为中心 printf&#xff1a;系统定义的标准函数 #include&l…

Java并发编程中的线程局部变量ThreadLocal variables的关键点是什么?

ThreadLocal变量的关键点 ThreadLocal变量是Java中用于实现线程局部存储的一种机制&#xff0c;它允许每个线程拥有自己的变量副本&#xff0c;从而避免了多线程环境下变量共享导致的并发问题。以下是ThreadLocal变量的几个关键点&#xff1a; 线程隔离&#xff1a;ThreadLoc…

探索 JQuery EasyUI:构建简单易用的前端页面

介绍 当我们站在网页开发的浩瀚世界中&#xff0c;眼花缭乱的选择让我们难以抉择。而就在这纷繁复杂的技术海洋中&#xff0c;JQuery EasyUI 如一位指路明灯&#xff0c;为我们提供了一条清晰的航线。 1.1 什么是 JQuery EasyUI&#xff1f; JQuery EasyUI&#xff0c;简单来…

DM达梦数据库转换、条件函数整理

&#x1f49d;&#x1f49d;&#x1f49d;首先&#xff0c;欢迎各位来到我的博客&#xff0c;很高兴能够在这里和您见面&#xff01;希望您在这里不仅可以有所收获&#xff0c;同时也能感受到一份轻松欢乐的氛围&#xff0c;祝你生活愉快&#xff01; &#x1f49d;&#x1f49…

分享AI学习笔记之Python

当你说"抓取网站数据"时&#xff0c;通常指的是网络爬虫&#xff08;web scraping&#xff09;或网络抓取&#xff08;web crawling&#xff09;。Python提供了很多库可以帮助你实现这个功能&#xff0c;其中最常见的有requests&#xff08;用于发送HTTP请求&#xf…

【乐吾乐2D可视化组态编辑器】画布

5.1 设置画布属性 默认颜色&#xff1a;预先设置默认颜色&#xff0c;拖拽到画布的节点&#xff08;基础图形、文字、icon&#xff09;自动统一默认颜色。 画笔填充颜色&#xff1a;预先设置画笔填充颜色&#xff0c;拖拽到画布的节点&#xff08;基础图形&#xff09;自动统…

QT自定义信号和槽函数

在QT中最重要也是必须要掌握的机制&#xff0c;就是信号与槽机制&#xff0c;在MFC上也就是类型的机制就是消息与响应函数机制 在QT中我们不仅要学会如何使用信号与槽机制&#xff0c;还要会自定义信号与槽函数&#xff0c;要自定义的原因是系统提供的信号&#xff0c;在一些情…

免费录制视频软件推荐,这3款软件超实用!

随着网络技术的发展&#xff0c;录制视频已经成为人们日常生活中的一个重要需求。无论是教学、会议、游戏还是娱乐&#xff0c;视频录制都为我们提供了极大的便利。然而&#xff0c;市场上的视频录制软件琳琅满目&#xff0c;如何选择一款适合自己的免费录制视频软件成为了一个…

Java基础知识-Map、HashMap、HashTable和TreeMap

1、HashMap 和 Hashtable 的区别&#xff1f; HashMap 和 Hashtable是Map接口的实现类&#xff0c;它们大体有一下几个区别&#xff1a; 1. 继承的父类不同。HashMap是继承自AbstractMap类&#xff0c;而HashTable是继承自Dictionary类。 2. 线程安全性不同。Hashtable 中的方…

Bootstrap 5 Flex

Bootstrap 5 Flex 简介 Bootstrap 5 是一个流行的前端框架,用于快速开发响应式和移动设备优先的网页。Flexbox 是 Bootstrap 5 中用于布局的强大工具,它提供了一种更加灵活和高效的方式来对齐和分布容器内的元素。在本篇文章中,我们将深入探讨 Bootstrap 5 中的 Flexbox 功…

安全管理中心测评项

安全管理中心 系统管理 应对系统管理员进行身份鉴别&#xff0c;只允许其通过特定的命令或操作界面进行系统管理操作&#xff0c;并对这些操作进行审计&#xff1b; 应通过系统管理员对系统的资源和运行进行配置、控制和管理&#xff0c;包括用户身份、系统资源配置、系统加…

MapStruct-JavaBean映射工具使用指南

在软件开发中&#xff0c;对象之间的转换是一项常见的任务&#xff0c;尤其是在处理数据模型间的映射时。传统的做法&#xff0c;如使用JavaBeanUtils&#xff0c;可能会导致性能下降&#xff0c;而手动编写转换代码则效率低下且易出错。为了解决这些问题&#xff0c;MapStruct…

为何整个 AI 领域都朝着 AI Agents 这一方向发展?

编者按&#xff1a; 当前大热的大语言模型和检索增强生成模型&#xff0c;虽然在语言理解和内容生成方面取得了突破性的进展&#xff0c;但仍然存在诸多限制。它们缺乏根据目标导引行为、持续学习和与环境交互的能力&#xff0c;难以应对复杂多变的现实场景需求。 今天为大家带…

Go Error 处理

&#x1f49d;&#x1f49d;&#x1f49d;欢迎莅临我的博客&#xff0c;很高兴能够在这里和您见面&#xff01;希望您在这里可以感受到一份轻松愉快的氛围&#xff0c;不仅可以获得有趣的内容和知识&#xff0c;也可以畅所欲言、分享您的想法和见解。 推荐:「stormsha的主页」…

HarmonyOS(39) Preferences 入门指南

Preferences Preferences应用实例初始化preferences保存并持久化数据获取数据 参考资料 Preferences Android开发程序员对此应该很熟悉&#xff0c;HarmonyOS里的Preferences跟Android里的SharePreference差不多&#xff0c;应用提供Key-Value键值型的数据处理能力&#xff0c…

HTTP性能测试工具 —— wrk!

wrk性能测试工具详解 wrk是一款轻量级但功能强大的HTTP基准测试工具&#xff0c;主要用于在单机多核CPU环境下对HTTP服务进行性能测试。它通过利用系统自带的高性能I/O机制&#xff08;如epoll、kqueue等&#xff09;&#xff0c;结合多线程和事件模式&#xff0c;能够产生大量…

AI 助力的在线 Excel 表格:真正的革命还是市场噱头?

在当今数字化和自动化的时代&#xff0c;人工智能&#xff08;AI&#xff09;技术被广泛应用于各种领域&#xff0c;从智能手机到工业生产&#xff0c;无所不在。最近&#xff0c;一些产品声称通过AI技术来增强传统的办公软件&#xff0c;如在线Excel表格。例如&#xff0c;Cha…

香港裸机云服务器连接失败怎么办?

香港裸机云服务器连接失败可能由多种原因引起。以下是一些建议和步骤&#xff0c;帮助诊断和解决问题&#xff0c;rak部落小编为您整理发布香港裸机云服务器连接失败的相关内容。 1. 检查网络连接&#xff1a; - 确认您的设备已经连接到互联网&#xff0c;并且网络状态稳定。 -…

1966 ssm 流浪猫领养网站系统开发mysql数据库web结构java编程计算机网页源码eclipse项目

一、源码特点 ssm 流浪猫领养网站系统是一套完善的信息系统&#xff0c;结合springMVC框架完成本系统&#xff0c;对理解JSP java编程开发语言有帮助系统采用SSM框架&#xff08;MVC模式开发&#xff09;&#xff0c;系统具有完整的源代码和数据库&#xff0c;系统主要采用B/…

华为od-C卷200分题目3 - 两个字符串间的最短路径问题

华为od-C卷200分题目3 - 两个字符串间的最短路径问题 题目描述 给定两个字符串&#xff0c;分别为字符串A与字符串B。 例如A字符串为ABCABBA&#xff0c;B字符串为CBABAC可以得到下图m*n的二维数组&#xff0c;定义原点为(0, 0)&#xff0c;终点为(m, n)&#xff0c;水平与垂…