Angular SPA + Jersey + SpringMVC 整合應用

原文排版地址:Angular SPA + Jersey + SpringMVC 整合應用

Angular SPA 單頁面應用和MVC控制器的整合，會有一個疑問，SPA中點擊連接的跳轉，是通過SPA的路由，仍是直接被SpringMVC攔截了?
ANGULAR SPA + JERSEY + SPRINGMVC 的框架主要有這樣的分工:

• ANGULAR SPA:頁面的切換跳轉，每一個頁面採用異步Ajax的方式獲取內容展現
• JERSEY: 爲SPA頁面提供Restful的API接口
• SpringMVC : 爲須要獨立出來的頁面做控制器

Jersey配置：web.xml

<servlet>
    <servlet-name >DGMSApplication </servlet-name >
    <servlet-class> org.glassfish.jersey.servlet.ServletContainer </servlet-class >
    <init-param >
        <param-name >javax.ws.rs.Application </param-name >
        < param-value> com.drivergroup.web.rest.DGMSApplication </param-value >
    </init-param >
    <load-on-startup >1 </load-on-startup >
</servlet >
<servlet-mapping >
    <servlet-name >DGMSApplication </servlet-name >
    <url-pattern >/api/* </url-pattern >
</servlet-mapping >

SpringMVC配置:web.xml文件配置

<servlet>
         <servlet-name>dgmsServlet</servlet-name>
         <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
         <init-param>
                <param-name>contextConfigLocation</param-name>
                <param-value>classpath:dgms-servlet.xml</param-value>
         </init-param>
         <load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
        <servlet-name>dgmsServlet</servlet-name>
        <url-pattern>/</url-pattern>
</servlet-mapping>

SpringMVC控制器

@Controller
@RequestMapping({"/article"})
public class ClientController {
     @RequestMapping(value = "article.html", method = RequestMethod.GET)
     public String  getArticleTest() {
          return "views/hello"; 
     }
}

<!-- 配置freeMarker視圖解析器, .htm後綴的用freemarker解析 --> 
<bean id="freemarkerViewResolver" class="com.gelonghui.springmvc.GlhFreemarkerViewResolver"> 
    <property name="contentType" value="text/html; charset=utf-8"/> 
    <property name="prefix" value="/"/>    
    <property name="suffix" value=".htm" />
</bean>

Angular SPA路由配置： route.js

GLHApp.config (['$routeProvider', '$locationProvider' , function ($routeProvider, $locationProvider) {
    $routeProvider.when('/' , {
        templateUrl: 'views/homeBeta.html'
    }).when('/article/detail', {
        templateUrl: '/article/detail.html'
    }).when('/article/test', {
        templateUrl: '/article/article.html'
    })otherwise({ redirectTo : '/' });
}]);

配置完成以後看下面的示例圖:

先回答第一個問題：SPA中點擊連接的跳轉先通過路由仍是攔截器，主要看連接的形式，Angular SPA會把/#/形式的連接先進行路由中轉處理，除了/#/形式的連接會按正常流程進入攔截器處理
這個時候若是連接不符合Jersey配置的話就會進入SpringMVC，SpringMVC沒有找到對應的請求就會返回404。

<a ng-href=」#/article/detail」>Angular SPA</a>
視圖：/view/details.html
<a ng-href=」/api/article/1″>Jersey</a>
視圖：{status:200 result:{…}} //json格式的數據
<a ng-href=」/article/article.html」>SpringMVC</a>
視圖：/views/hello.htm

咱們還能夠實現Angular SPA和MVC控制器耦合的狀況: 連接以/#/開頭，通過路由route.js文件，而後跳轉到SpringMVC處理完成後返回一個試圖顯示

參考網站:

Java Spring Mvc Single Page App with Upida/Jeneva (Frontend/AngularJS)

轉載請註明出處 做者:zhida 來源:paraller's blog