vue路由切换history导致刷新页面500

一、修改vue路由模式的原因

项目部署时，由于我们是在一个nginx上面部署多套前端项目，而且用的还是hash模式。所以导致我们访问的路径中携带了#。正常项目无所谓，但其中一个公众号的h5页面有绑定微信的功能，这就导致绑定微信跳转直接报错。为了解决该bug，于是我们就将vue的路由模式改为了history。（由于该项目是指定路径，所以base中增加了/ydd/）

二、history出现的问题

路由模式修改为history后路径中确实去除了#号，但访问页面时，除了首页刷新没啥问题，其他页面刷新一律提示500。所以又开始了第二个bug的修复

三、修复方法

修改nginx配置。按网上找了半天的修改方法，都说是增加一个 try_files $uri $uri/ /index.html; 配置即可。但配置后仍是刷新当前页面跳转500

server {
		listen 80;
		server_name alumni.chnu.edu.cn;
		client_max_body_size 10m;

		location / {
			   root  /mnt/web;
			   try_files $uri $uri/ /index.html;
			   index  index.html index.htm;
		}
	
		location /ydd {
			alias  /mnt/h5;
			index  index.html index.htm;
			try_files $uri $uri/ index.html;
		}
	}

四、修复方法（最终版）

上述出现bug的主要原因是因为当前项目访问的路径部署/，而是/ydd。所以必须在 try_files $uri $uri/ /ydd/index.html; 中增加/ydd

server {
		listen 80;
		server_name alumni.chnu.edu.cn;
		client_max_body_size 10m;

		location / {
			   root  /mnt/web;
			   try_files $uri $uri/ /index.html;
			   index  index.html index.htm;
		}
	
		location /ydd {
			alias  /mnt/h5;
			index  index.html index.htm;
			try_files $uri $uri/ /ydd/index.html;
		}
	}