请教前后端项目部署问题？

Question

最近在学习前后端分离，前端使用vue.js,后端thinkphp，不是很理解项目文件部署，特来请教各位，望好心人解惑!

思路：

1. 构建一个项目文件夹demo，子目录->a1,a2
2. a1放前端项目，a2放后端项目
3. test.com通过服务器配置直接请求a1文件夹下的index.html
4. 通过前端路由跳转，完成页面之间的切换，数据从后端去获取
5. 前端请求数据地址test.com/news/p/123，通过服务器配置进入a2文件夹，异步返回数据

整个流程就是前端负责页面，后端负责数据接口，解决前后端耦合开发的困境。目前有2个问疑惑：

---1、上述思路是否有问题？
---2、如何配置服务器（apche、nginx），一个域名test.com去不同的文件夹（test.com去a1,test.com/news/p/123去找a2）

Answer 1

1、没有问题，也未必非要放入同一个文件夹，既然解耦说明前端和后端毫无关联，也可以放到不同的服务器上。
2、使用apache或者nginx的反向代理
(补充)3、反向代理指向了前端,前端也是需要在linux后台运行，可以使用forever或者系统自带的nohup

Answer 2

问题描述我就不看啦. 直接说我的观点.(你也可以直接不看答案)

首先, 假设我们把前后端项目部署到不同服务器上. 前端为FEServer, 后端为BEServer.

给后端的API加一个CORS头, 解决了跨域的问题(最简单粗暴).

然后用户的入口为FEServer, 用户访问FEServer返回视图(包括js), 需要用到数据的地方再从api拿json.

这样是不是就实现了前后端完全的分离? FEServer可以实现路由等功能.

那如果是部署在同一台服务器上, 也是类似的方法, 配置一个vhost, 让前后端的入口不一样就好啦.

具体的可以查询"Nginx虚拟主机配置"