如何将 Spring MVC 与 AngularJS ui-router 一起使用？答案

【问题标题】：How to use Spring MVC with AngularJS ui-router?如何将 Spring MVC 与 AngularJS ui-router 一起使用？
【发布时间】：2015-11-28 15:22:55
【问题描述】：

如何设置 Spring MVC 以捕获所有请求并仅返回我的欢迎页面 (index.html)？

我的总体意图是使用 Spring MVC 拦截任何带有“/api/”的内容，以便我可以调用后端，但任何其他 url 都应该返回“index.html”，以便 ui-router 可以尝试显示正确的观点。

但是，在我当前的设置下，我可以使用 ui-router 在网站上导航，但是当我尝试导航到应该由 ui-router 解析的 url 时，我收到此错误：

Problem accessing /app/hi/hello. Reason:
Circular view path [index.html]: would dispatch back to the current handler URL 
[/app/hi/index.html] again. Check your ViewResolver setup! (Hint: This may be the result 
of an unspecified view, due to default view name generation.)

我的设置：

BaseController.java

@Controller
public class BaseController {

    @RequestMapping("/app/**")
    public String get() {
       return "index.html";
    }
}

web.xml

<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
    <servlet>
        <servlet-name>mvc-dispatcher</servlet-name>
        <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
        <init-param>
            <param-name>contextConfigLocation</param-name>
            <param-value>/WEB-INF/mvc-dispatcher-servlet.xml</param-value>
        </init-param>
        <load-on-startup>1</load-on-startup>
    </servlet>

    <welcome-file-list>
        <welcome-file>index.html</welcome-file>
    </welcome-file-list>

    <servlet-mapping>
        <servlet-name>mvc-dispatcher</servlet-name>
        <url-pattern>/</url-pattern>
    </servlet-mapping>
</web-app>

mvc-dispatch-servlet.xml

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xmlns:context="http://www.springframework.org/schema/context"
       xmlns:mvc="http://www.springframework.org/schema/mvc"
       xsi:schemaLocation="http://www.springframework.org/schema/beans
  http://www.springframework.org/schema/beans/spring-beans-3.0.xsd
  http://www.springframework.org/schema/context
  http://www.springframework.org/schema/context/spring-context-3.0.xsd
  http://www.springframework.org/schema/mvc http://www.springframework.org/schema/mvc/spring-mvc.xsd">

    <context:component-scan base-package="com.football_preds"/>
    <mvc:annotation-driven/>
    <mvc:resources mapping="/app/**" location="/" />

    <bean id="viewResolver"
          class="org.springframework.web.servlet.view.InternalResourceViewResolver">
        <property name="prefix">
            <value>/views/</value>
        </property>
        <property name="suffix">
            <value>.jsp</value>
        </property>
    </bean>
</beans>

index.html

<head>
  <link href="style.css" rel="stylesheet"/>
  <meta charset="utf-8">
  <script src="dist/football-preds.js"></script>
  <title>Football Predictions</title>
</head>

<body ng-controller="MainController">
  <section ui-view></section>

  <button ui-sref="login">Login page</button>
</body>

【问题讨论】：

标签： java angularjs google-app-engine spring-mvc angular-ui-router

【解决方案1】：

我是如何解决的：

将index.html 移至/views 并重命名为index.jsp

我的控制器类：

@Controller
public class BaseController {

    // Map all urls to this method aside from ones starting with api
    @RequestMapping(value = "/**")
    public String getIndex() {
        // return the view called "index.html" (in the current directory)
        return "index";
    }

    @RequestMapping(value = "/api/**")
    @ResponseBody
    public String testApi() {
        return "test string";
    }
}

通过某种方式，它设法处理所有不以“/api”为前缀的请求，并返回使用 ui-router 处理 url 的索引页面。

【讨论】：

【解决方案2】：

你弄错了。

仅调度一个服务器页面（index.jsp），Angular 是 SPA。

在那之后，Spring 应该提供所有 RESTful API 来拥有 Angulared 应用程序。

ui-router 是客户端站点路由库。

public class HelloWorldController extends AbstractController{

    @Override
    protected ModelAndView home(HttpServletRequest request,
        HttpServletResponse response) throws Exception {

        ModelAndView model = new ModelAndView("home");

        return model;
    }
}

这应该返回 home.do 或按照您的配置。

【讨论】：

但是如何设置 GAE/Spring 以返回 index.jsp 而不管 url 是什么？
你可以参考这个tutmkyong.com/spring-mvc/spring-mvc-hello-world-example也有一个服务器页面可以使用。
那么你可以在请求映射中有“/api”来区分api调用。
当有人点击 url example.com/category/restaurant 会发生什么？在这种情况下，预期行为是服务器返回 index.html。 ui rounter 根据 url 字符串决定调用哪个 API。