基于Spring MVC和AngularJS前后端分离的实践

本文主要介绍基于Spring MVC和AngularJS前后端分离的简单实践。
1    为何要前后端分离
1.1    传统web开发存在的问题
（1）前端代码越来越复杂
•    无法统一协作模式，代码充满了约定
•    JS跟CSS，依赖于后端产出的HTML
•    有的数据来自AJAX，有的数据印在DOM上
•    有的业务逻辑在前端，有的在Model层，更多的是在View层
（2）前后端高度耦合
•    前端依赖服务端开发环境
•    在服务端View层高度耦合
•    沟通成本高
•    职责不清晰
（3）无法良好的支持跨终端
•    业务逻辑散落在应用中
•    渲染逻辑强依赖后端页面
•    只能用responsive design硬来
（4）高度耦合的前后端分工
•    沟通成本上升
•    维护成本上升
•    无法正确且快速的响应变化
•    代码的腐烂只是迟早的问题

1.2    前后端分离的优势
•    关注点分离
•    职责分离
•    对的人做对的事
•    更好的共建模式
•    快速的反应变化

1.3    前后端分离的架构
重新定义的前后端：
在服务器(JAVA) 与 浏览器(JS)的中间架了一个中间层(NodeJS)。

职责划分：

2    简单实践
2.1    后端java实现
采用Spring MVC架构，纯java代码，controller层只对外提供Restful API，与前端只进行json数据交互。

示例代码：
使用eclipse建立maven web工程。
（1）    pom.xml
加入spring mvc配置

（2）    spring-config.xml
加入annotation-driven和component-scan属性：

配置Mybatis数据库连接：

（3）java代码实现Restful API
登陆入口controller：

2.2    前端AngularJS实现
（1）    前端路由配置

（2）    前端controller配置

2.3    引入nodejs
目前前端是部署在tomcat上面的，后续考虑引入nodejs作为路由转发器，配置expression插件进行转发。