解决vue路由history模式刷新后404的问题
server {
listen ;#默认端口是80,如果端口没被占用可以不用修改
server_name localhost;
root E:/vue/my_project/dist;#vue项目的打包后的dist
location / {
try_files $uri $uri/ @router;#需要指向下面的@router否则会出现vue的路由在nginx中刷新出现404
index index.html index.htm;
}
#对应上面的@router,主要原因是路由的路径资源并不是一个真实的路径,所以无法找到具体的文件
#因此需要rewrite到index.html中,然后交给路由在处理请求资源
location @router {
rewrite ^.*$ /index.html last;
}
#.......其他部分省略
}
解决vue路由history模式刷新后404的问题的更多相关文章
- vue下history模式刷新后404错误解决
官方说明文档: https://router.vuejs.org/zh/g... 一. 实测 Linux 系统 Apache 配置: 更改站点配置文件即可,我这里在 Directory 标签后面添加了 ...
- 新来的前端小姐姐问:Vue路由history模式刷新页面出现404问题
摘要:vue-router 默认 hash 模式 -- 使用 URL 的 hash 来模拟一个完整的 URL,于是当 URL 改变时,页面不会重新加载. 本文分享自华为云社区<学习Vue Rou ...
- vue路由history模式刷新页面出现404问题
vue hash模式下,URL中存在'#',用'history'模式就能解决这个问题.但是history模式会出现刷新页面后,页面出现404.解决的办法是用nginx配置一下.在nginx的配置文件中 ...
- vue路由history模式刷新404问题解决方案
更改router 的base // biz是二级目录,路由文件改成 const router = new VueRouter({ mode: 'history', // base: process.e ...
- K8s nginx-ingress 如何配置二级目录转发远程静态服务器基于Vue路由history模式打包的应用程序
背景 首先这标题有点绕,我先解释下: 首先我们有静态服务器,上面某个目录有Vue路由history模式打包的应用程序(也就是build后的产物): 但是静态服务器一般不做对外域名用的,我们需要在k8s ...
- Vue路由history模式踩坑记录:nginx配置解决404问题
问题背景: vue-router 默认是hash模式,使用url的hash来模拟一个完整的url,当url改变的时候,页面不会重新加载.但是如果我们不想hash这种以#号结尾的路径时候的话,我们可以使 ...
- vue react 路由history模式刷新404问题解决方案
vue单页因微信分享和自动登录需要,对于URL中存在’#’的地址,处理起来比较坑.用history模式就不会存在这样的问题.但是换成history模式,就会有个新的问题,就是页面刷新后,页面就无法显示 ...
- VUE路由history模式坑记--NGINX
因微信分享和自动登录需要,对于URL中存在'#'的地址,处理起来比较坑(需要手动写一些代码来处理).还有可能会有一些隐藏的问题没被发现. 如果VUE能像其他(JSP/PHP)系统的路径一样,就不存在这 ...
- vue路由history模式下打包node服务器配置
vue-router 默认 hash 模式 —— 使用 URL 的 hash 来模拟一个完整的 URL,于是当 URL 改变时,页面不会重新加载. 如果不想要很丑的 hash,我们可以用路由的 his ...
随机推荐
- django 模板使用
1 配置 在工程中创建模板目录templates. 在settings.py配置文件中修改TEMPLATES配置项的DIRS值: TEMPLATES = [ { 'BACKEND': 'django. ...
- 信号基础知识--FFT DFT
clc;close all;clear all; f0=10; fs=100; %采样率 t=1/fs:1/fs:2; %共两秒钟,共200个采样点.采样间隔T=1/100 y ...
- [leetcode]265. Paint House II粉刷房子(K色可选)
There are a row of n houses, each house can be painted with one of the k colors. The cost of paintin ...
- (sealed)密封类及密封方法优缺点
1. 密封类防止被继承 (有利于代码优化, 由于密封类的不被继承性, 代码在搜索此方法时可以直接定位, 不需要一层层的找继承关系) 只有本程序集可以使用 2. 密封类中不需要再写密封方法(一般密封方法 ...
- ubuntu输入法
一直都是使用搜狗的,但是感觉一直都不兼容.经常输入一串文字导致输入法崩溃 比如 ‘外显’waixian就崩了. 而且会出现fcitx 100%cpu占用的情况 pkill fcitx &&am ...
- OS history
UNIX的诞生 1965年时,贝尔实验室(Bell Labs)加入一项由奇异电子(General Electric)和麻省理工学院(MIT)合作的计划:该计划要建立一套多使用者.多任务.多层次(m ...
- CentOS No package nginx available.
CentOS No package nginx available. yum install epel-release 如果不行 https://blog.csdn.net/u012965373/ar ...
- ELK+SpringBoot+Logback离线安装及配置
ELK+SpringBoot+Logback 离线安装及配置 版本 v1.0 编写时间 2018/6/11 编写人 xxx 目录 一. ELK介绍2 二. 安装环境2 三. Elasticse ...
- Linux驱动之异步通知的应用
前面的按键驱动方式都是应用程序通过主动查询的方式获得按键值的: 1.查询方式 2.中断方式 3.poll机制 下面介绍第四种按键驱动的方式 4.异步通知:它可以做到应用程序不用随时去查询按键的状态,而 ...
- RN与webview通讯
一.RN给webview发送信息 this.webview.postMessage(message) 二.监听从React Native发过来的消息: window.document.addEven ...