解决vuejs应用在nginx非根目录下部署时访问404的问题
以往部署vuejs应用都是直接在nginx的location为/下直接部署,这次遇到要将vue应用部署在/vuejs-admin的非根下,使用以往部署方案直接访问就会404,这时修改步骤如下:
1、修改项目router配置,如下:
这里一是要修改router模式为history,另一个就是修改base地址为要访问的/vuejs-admin的地址,注意前后都有斜线
2、修改build下静态资源路径前缀
同上一部,这里要修改assetsPublicPath为/vuejs-admin/地址
3、执行vuejs打包:npm run build
确保打包后所有静态资源均是相对地址/vuejs-admin开头,比如:
4、修改nginx配置,使用rewrite配置
server {
listen 80;
server_name xxxx.com;
#charset koi8-r;
#access_log logs/host.access.log main;
location /vuejs-admin-server {
proxy_pass http://127.0.0.1:8080/vuejs-admin-server;
}
location ^~/vuejs-admin {
alias /home/server/webapps/vuejs-admin/;
#index index.html;
try_files $uri $uri/ @rewrites;
}
location @rewrites {
rewrite ^/(vuejs-admin)/(.+)$ /$1/index.html last;
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
}
5、热重载nginx,搞定收工:nginx -s reload
解决vuejs应用在nginx非根目录下部署时访问404的问题的更多相关文章
- 解决:Android编译源码根目录下/system/vold后,通过push命令将编译生成的vold文件push至system/bin下无法正常开机
这段时间由于工作需要,在对android根目录下/system/vold进行修改编译的时候,在通过adb命令将vold文件push至/system/bin目录下,adb reboot重启手机却发现一直 ...
- 由Nginx的DNS缓存导致的访问404
现象 访问某个URL出现404,而且全站都是404.通过日志查看Nginx的规则也正确,请求被代理到指定位置. 排查 最近针对这个站点没有修改过Nginx配置也没有站点升级.所以应该是其他原因.首先P ...
- tomcat下部署可以访问的文件夹
项目名#文件夹名#文件夹名.xml <Context docBase="D:\文件夹名\r文件夹名"/> 例如: test#zhang#test1.xml <Co ...
- centos7一步一步搭建docker phpmyadmin 及nginx配置phpmyadmin非根目录重点讲解
系统环境:centos7.7 镜像image 版本:phpmyadmin/phpmyadmin(截止2020.01.10最新版) 参考文章:https://blog.csdn.net/a258929 ...
- 在Docker下部署Nginx
在Docker下部署Nginx 在Docker下部署Nginx,包括: 部署一个最简单的Nginx,可以通过80端口访问默认的网站 设置记录访问和错误日志的路径 设置静态网站的路径 通过proxy_p ...
- 解决iOS项目根目录下文件乱七八糟的问题
对于一个刚做项目的新手来说,肯定会碰到一个相当蛋疼的问题,那就是你在项目中建立的文件夹与你在根目录下的文件夹完全对应不起来,说直接点就是你通过group的方式在项目中建立的文件夹在本目录下根本就没有. ...
- vue 在nginx下页面刷新出现404问题解决和在nginx下页面加载了js但是页面显示空白问题解决
一.vue 在nginx下页面刷新出现404 在网上翻遍了所有这样问题的解决办法,全都是一个解决办法也是正确的解决办法,(后来在vue官网上关于history方式出现404解决方法也是这样说的),只是 ...
- Nginx + Tomcat Windows下的负载均衡配置
Nginx + Tomcat Windows下的负载均衡配置 一.为什么需要对Tomcat服务器做负载均衡? Tomcat服务器作为一个Web服务器,其并发数在300-500之间,如果超过50 ...
- Django Linux环境下部署CentOS7+Python3+Django+uWSGI+Nginx(含Nginx返回400问题处理、防火墙管理)
本文将介绍如何在Linux系统上部署Django web项目,本次部署基于下面的架构: CentOS7+ Python3.5 + Django1.11 + uWSGI + Nginx 亲测可行!!按照 ...
随机推荐
- AI贪吃蛇前瞻——基于Dijkstra算法的最短路径问题
在贪吃蛇流程结构优化之后,我又不满足于亲自操刀控制这条蠢蠢的蛇,干脆就让它升级成AI,我来看程序自己玩,哈哈. 一.Dijkstra算法原理 作为一种广为人知的单源最短路径算法,Dijkstra用于求 ...
- python web开发c6——阿里云上ubuntu+flask+gunicorn+nginx服务器部署(一)简单测试
简述 Nginx在服务器部署中的作用 请求通过Nginx实现反向代理,将请求提交给代理服务器.本文中只用了一台服务器,所以是代理到本机. gunicorn的作用 作为服务器代码的容器.接收Nginx的 ...
- 内核漏洞学习—熟悉HEVD
一直以来内核漏洞安全给很多人的印象就是:难,枯燥.但是内核安全是否掌握是衡量一个系统安全工程师水平的标准之一,也是安全从业人员都应该掌握的基本功.本文通过详细的实例带领读者走进内核安全的大门.难度系数 ...
- poj2479 Maximum sum
http://poj.org/problem?id=2479 题目大意:给定一组n个整数:a ={a1, a2,…,我们定义一个函数d(a)如下: 你的任务是计算d(A).输入由T(<=30)测 ...
- elasticsearch Geo Distance Query
Geo Distance Query 过滤器文档只包括在一个特定距离内存在于一个地理点上的命中.假设下列映射和索引文档: PUT /my_locations { "mappings" ...
- 组件基础—Vue学习笔记
ammm学习Vue有好几天了,今天遇到难点所以打算写一点随笔加深印象. 一.首先最简单的创建组件 1全局组件 Vue.component() Vue.component('hello',{ tem ...
- SQL与NOSQL
一:关系型数据库 1.概念: 采用了关系模型来组织数据的数据库.简单讲,关系模型就是二维表格模型.二维表格在 数据库中我们称之为记录,列在数据库中我们成为字段. 2举例: M ...
- Go语言学习笔记(3)——分支、循环结构
1 条件语句: if, else if, else 特殊用法:判断num是奇是偶:其中局部变量num只能在该if...else语句中使用! if num := 10; num % 2 == 0 { ...
- leetcode-917-仅仅反转字母
题目描述: 给定一个字符串 S,返回 “反转后的” 字符串,其中不是字母的字符都保留在原地,而所有字母的位置发生反转. 示例 1: 输入:"ab-cd" 输出:"dc-b ...
- 【learning】vim爆改记 (如何让vim用起来像devc++)
由于本蒟蒻NOIP人品大爆发,能去冬令营,故准备开始练习使用linux下的IDE:vim 在dalao DTZ的帮助下,我装好了vim,并做了最初的配置. 然而........好难用啊,怎么和devc ...