基于NODEJS的前后端项目分离实践

前后端分离项目实践

 

一、前言

     对nodejs有了些准备，希望多了解些后端知识，恰逢公司项目调整，分析了前后端分离的优劣，也做了一个完整的demo演示，同事都觉得靠谱，用了两个版本的时间，将公司主站项目用nodejs实现了前后端分离，在此和大家分享下，以求共同进步。案例参见 www.upopen.cn

 

二、为何做分离

     1、开发体系：架构体系决定了后端重于前端，前端做好静态页后，要转为php或vm等，开发要用eclipce等后端环境工作，一大堆让前端迷糊的配置，一旦java人员更新了错误的文件，会导致所有人的环境启动不了，束手无策，只能等待救援。

     2、难维护：页面总是会有php\jsp等非前端代码，相互干扰、无法优化，时间越久问题越突出。

     3、前后端职责不清晰。

     有人会问，分离为什么不全部走ajax，页面就不需要任何服务端语言了。但实际场景并非如此，首先有些数据总是要生成页面时就已经同步获取的，且全异步对SEO不利、纯html页面没有include功能等。

网上还有其它的理解，大致相同就不列举了。

 

三、如何做分离

     1、产品设计确定后，前后端人员共同制定开发接口，为方便接口的制定、显示、测试，使用nodejs+mongodb开发了接口平台。参见http://www.upopen.cn:8090/interface/index

功能：制定接口时就直接在interface平台上新增录入ActionName、description、 method、 param 及 默认值 等并保存到mongodb，当后台开发完成后，直接用在该页面做接口测试，成功后方可交付，避免联调过程中的接口反复。（原本想用interface.upopen.cn 来测试同域名下的项目，但因cookie在不同二级域名下无法共享的问题，暂用了二级目录，不过已有方案，后续优化）

 

     2、从前端角度考虑系统架构图如下：

 

1. 访问入口 NGINX 代理静态资源到 STATIC 服务器，其它请求则到 NODEJS。

2. 页面请求NODEJS直接render，数据相关NODEJS则做预处理，再发到后台

3. 前端据已定义的接口，通过nodejs+mysql模拟后台完成数据存取，此处会增加些工作量，但只是为了走通业务流程，模拟后台数据表定义及逻辑无需严谨，只要能正常存取即可，如注册用户save to DB，登录验证read from DB，所以提供模式化的工具、写法后，新增表、接口，并不会多耗时间，nginx – nodejs – 模拟后台，即可按实际使用完成所有前端工作。

4. QA单独测前端时，修改hostIP指向到测试工具。

5. Java开发完成后接口，在 Interface平台 上验证所有接口，确认无误。QA也可以通过Interface测试Java接口

6. nodejs修改config里的hostIP配置到java，理想情况下，修改此步配置即完成联调

 

每个模块的简略部署如下：

Nginx.conf：

     Location ~ \.(jpg|png|css|js ){ //静态资源代理