vue下history模式刷新后404错误解决
官方说明文档:
https://router.vuejs.org/zh/g...
一、 实测 Linux 系统 Apache 配置:
更改站点配置文件即可,我这里在 Directory 标签后面添加了官方给的五行配置
<VirtualHost *:80>
#Created by linvic on 2018-05-24
Serveradmin 674206994@qq.com
ServerName blog.xxx.com
DocumentRoot /home/www/blog
<Directory "/home/www/blog">
Options FollowSymLinks
AllowOverride All
#Require all denied
Require all granted
RewriteEngine On
RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.html [L]
</Directory>
</VirtualHost>
二、 实测 Windows 环境下 IIS 配置
1. IIS安装Url重写功能
https://msdn.microsoft.com/zh...
- 到该网站下载安装
web平台安装程序
- 安装后打开到里面搜索安装
URL重写功能
2. web.config
将web.config 文件放置于 npm run build 打包后文件的根目录即可。
ps:此文件会自动给IIS上的URL重写功能进行相关配置
文件内容如下:
<?xml version="1.0" encoding="UTF-8"?>
<configuration>
<system.webServer>
<staticContent>
<remove fileExtension=".woff" />
<mimeMap fileExtension=".woff" mimeType="font/x-woff" />
<remove fileExtension=".woff2" />
<mimeMap fileExtension=".woff2" mimeType="font/x-woff2" />
<remove fileExtension=".ttf" />
<mimeMap fileExtension=".ttf" mimeType="font/x-ttf" />
<remove fileExtension=".json" />
<mimeMap fileExtension=".json" mimeType="text/json" />
</staticContent>
<rewrite>
<rules>
<rule name="vue" stopProcessing="true">
<match url=".*" />
<conditions logicalGrouping="MatchAll">
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
<add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
</conditions>
<action type="Rewrite" url="/" />
</rule>
</rules>
</rewrite>
</system.webServer>
</configuration>
vue下history模式刷新后404错误解决的更多相关文章
- 解决vue路由history模式刷新后404的问题
server { listen ;#默认端口是80,如果端口没被占用可以不用修改 server_name localhost; root E:/vue/my_project/dist;#vue项目的打 ...
- 新来的前端小姐姐问:Vue路由history模式刷新页面出现404问题
摘要:vue-router 默认 hash 模式 -- 使用 URL 的 hash 来模拟一个完整的 URL,于是当 URL 改变时,页面不会重新加载. 本文分享自华为云社区<学习Vue Rou ...
- vue路由history模式刷新页面出现404问题
vue hash模式下,URL中存在'#',用'history'模式就能解决这个问题.但是history模式会出现刷新页面后,页面出现404.解决的办法是用nginx配置一下.在nginx的配置文件中 ...
- vue下使用nginx刷新页面404
nginx 是一个代理的服务器.出现的问题:写好的页面通过nginx作为代理的服务器给别的同事看的时候发现了新写的页面打开就404,并且从其他页面跳转可以看到但是刷新页面就404.解决方法:在文件中的 ...
- vue路由history模式刷新404问题解决方案
更改router 的base // biz是二级目录,路由文件改成 const router = new VueRouter({ mode: 'history', // base: process.e ...
- Servlet访问第一次500,刷新后404的解决办法
第一次运行错误:HTTP Status 500 - --------------------------------------------type Exception reportmessage ...
- antdpro 打包部署后访问路由刷新后404
antdpro build 后访问路由刷新后 404? 解决方法有三种: 1. 改用 hashHistory,在 .umirc.js或者是config.js 里配 history: 'hash' 2. ...
- Vue项目history模式下微信分享总结
原文 : http://justyeh.top/post/39/ 2019-07-02 Vue微信分享 每回遇到微信分享都是一个坑,目前的商城项目使用Vue开发,采用history的路由模式,配置微信 ...
- 在nginx上部署vue项目(history模式);
在nginx上部署vue项目(history模式): vue-router 默认是hash模式,使用url的hash来模拟一个完整的url,当url改变的时候,页面不会重新加载.但是如果我们不想has ...
随机推荐
- C语言基础练习——打印乘法口诀表
C语言基础练习--打印乘法口诀表 JERRY_Z. ~ 2020 / 8 / 26 转载请注明出处! 代码: /* * @Author: JERRY_Z. * @Date: 2020-08-26 16 ...
- discuz论坛替换logo之后不显示该怎么办
http://www.wocaoseo.com/thread-2-1-1.html 这个虽然不算是seo的问题,但是在平时的操作之中经常性的遇到,常常是我用FTP已经上传替换了原来的logo,但是前台 ...
- Qt 子窗口监听主窗口信号
Qt 子窗口监听主窗口信号(转载) 原文链接:https://www.cnblogs.com/ybqjymy/p/12169762.html 1 MainWindow *ptr = NULL; 2 ...
- python练习 英文字符的鲁棒输入+数字的鲁棒输入
鲁棒 = Robust 健壮 英文字符的鲁棒输入 描述 获得用户的任何可能输入,将其中的英文字符进行打印输出,程序不出现错误. ...
- android开发之动画的详解 整理资料 Android开发程序小冰整理
/** * 作者:David Zheng on 2015/11/7 15:38 * * 网站:http://www.93sec.cc * * 微博:http://weibo.com/mcxiaob ...
- Shader之溶解效果的几种实现方法
这里通过 “是否丢弃像素”的2种方法,写2个shader,效果是一样的,也提到了,丢弃某个像素的3种方式. 是否丢弃: 1.通过脚本控制shader变量判断当前是否丢弃像素,需要额外脚本: 2.sha ...
- 基于PHP实现CMS识别
最近正在开发一款基于PHP实现的Web安全检测平台,写到了CMS识别这一功能,便写一篇文章总结一下. 首先需要梳理的是CMS识别的几种方法: 1.网页源代码特征:例如源代码中包含CMS的名称或是某种特 ...
- 原生javaScript导出表格数据
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...
- [业界方案] 用SOFATracer学习分布式追踪系统Opentracing
[业界方案] 用SOFATracer学习分布式追踪系统Opentracing 目录 [业界方案] 用SOFATracer学习分布式追踪系统Opentracing 0x00 摘要 0x01 缘由 &am ...
- 用于测试 JsonAnalyzer2 1.01版的测试用例
14. 原文={"animal":"ca,t","color":"ora:nge","isMale" ...