224. 子路径访问，解决404（history 模式，base使用）

[ly525]

场景

以下域名均为虚拟域名

1. 公司的一个内部项目，使用了 Material Design 做了重构，需要替换现在的线上版本（http://legacy.com）
2. Material Design 版本采用新域名为: https://material-design.com
3. 因为时间比较仓促，老版本（http://legacy.com）一些功能，还没有完全集成到新版本上，因此老版本仍然需要发挥余热。因此 和老大讨论之后，新版本和老版本的上线方案如下：

---

1. 新旧版本全部采用 HTTPS 协议
2. 新版本的域名为：https://material-design.com
3. 保留老版本的功能，老版本的域名由 http://legacy.com 更新为 https://material-design.com/legacy/
4. 用户访问老版本 http://legacy.com，前端跳转至新版本 document.locatio=https://material-design.com/legacy/。不采用后端 Nginx 重定向的原因会在其它中补充说明。

其它

1. 不采用后端 Nginx 重定向的原因

Solution

1. nginx

  location ^~ /legacy {
	    alias /data/proj/legacy-frontend/;
	    #try_files $uri $uri/ /index.html;
	    try_files $uri $uri/ /legacy/;
	  }

2. vue router

var router = new Router({
   mode: 'history',
   base: '/legacy/',
});