修复vue单页面应用直接访问url会出现404的问题

最新推荐文章于 2024-04-19 17:24:52 发布

Cheryl71

最新推荐文章于 2024-04-19 17:24:52 发布

阅读量1.2k

点赞数 1

分类专栏： vue 文章标签： vue

本文链接：https://blog.csdn.net/Day71/article/details/115162079

版权

vue 专栏收录该内容

44 篇文章 2 订阅

订阅专栏

在网站根目录中创建一个 web.config文件，内容如下：

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
	<system.webServer>
		<rewrite>
			<rules>
				<rule name="Handle History Mode and custom 404/500" 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>

设置 <match url="(.*)" /> 为想要匹配的路径，
如：我想所有以 nav/ 路由的子页面都能通过 url 进行访问则配置为如下：

<?xml version="1.0" encoding="UTF-8"?>
<configuration>
	<system.webServer>
		<rewrite>
			<rules>
				<rule name="Handle History Mode and custom 404/500" stopProcessing="true">
					<match url="^nav/(.*)" />
					<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>