SpringMVC02_回應資料和結果視圖-有解無憂

本教程原始碼請訪問：tutorial_demo

一、環境搭建

1.1、創建工程

在idea中從原型創建Maven工程，選擇org.apache.maven.archetypes:maven-archetype-webapp，在pom.xml中添加如下的坐標：

<dependency>
    <groupId>org.springframework</groupId>
    <artifactId>spring-context</artifactId>
    <version>5.2.6.RELEASE</version>
</dependency>
<dependency>
    <groupId>org.springframework</groupId>
    <artifactId>spring-web</artifactId>
    <version>5.2.6.RELEASE</version>
</dependency>
<dependency>
    <groupId>org.springframework</groupId>
    <artifactId>spring-webmvc</artifactId>
    <version>5.2.6.RELEASE</version>
</dependency>
<!-- Servlet -->
<dependency>
    <groupId>javax.servlet</groupId>
    <artifactId>servlet-api</artifactId>
    <version>2.5</version>
    <scope>provided</scope>
</dependency>
<!-- JSP -->
<dependency>
    <groupId>javax.servlet.jsp</groupId>
    <artifactId>jsp-api</artifactId>
    <version>2.0</version>
    <scope>provided</scope>
</dependency>
<dependency>
    <groupId>junit</groupId>
    <artifactId>junit</artifactId>
    <version>4.11</version>
    <scope>test</scope>
</dependency>
<dependency>
    <groupId>com.fasterxml.jackson.core</groupId>
    <artifactId>jackson-databind</artifactId>
    <version>2.9.0</version>
</dependency>
<dependency>
    <groupId>com.fasterxml.jackson.core</groupId>
    <artifactId>jackson-core</artifactId>
    <version>2.9.0</version>
</dependency>
<dependency>
    <groupId>com.fasterxml.jackson.core</groupId>
    <artifactId>jackson-annotations</artifactId>
    <version>2.9.0</version>
</dependency>

這里注意，由于我們這個是JavaWeb專案，一定要添加Servlet和JSP的坐標，

1.2、在專案中創建存放原始碼和組態檔的目錄

在src/main目錄下創建java和resources兩個目錄，java目錄用來存放Java原始碼，resources用來存放組態檔，這樣創建的目錄是普通目錄，編譯時不能被正確識別，此時還需要進行如下操作：

在java目錄上右鍵-->Make Directory as-->Sources root；
在resources目錄上右鍵-->Make Directory as-->Resources Root；

以后的教程里面，只要涉及到Maven的Java Web工程，都要這樣做，

1.3、撰寫SpringMVC的組態檔

在resources目錄下新建springmvc.xml，

<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
       xmlns:mvc="http://www.springframework.org/schema/mvc"
       xmlns:context="http://www.springframework.org/schema/context"
       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xsi:schemaLocation="
                http://www.springframework.org/schema/beans
                http://www.springframework.org/schema/beans/spring-beans.xsd
                http://www.springframework.org/schema/mvc
                http://www.springframework.org/schema/mvc/spring-mvc.xsd
                http://www.springframework.org/schema/context
                http://www.springframework.org/schema/context/spring-context.xsd">
    <!-- 配置spring創建容器時要掃描的包 -->
    <context:component-scan base-package="org.codeaction"></context:component-scan>
    <!-- 配置視圖決議器 -->
    <bean id="viewResolver"
          >
        <property name="prefix" value="https://www.cnblogs.com/WEB-INF/pages/"></property>
        <property name="suffix" value="https://www.cnblogs.com/codeaction/p/.jsp"></property>
    </bean>

    <!--
        配置靜態資源不過濾
        location：表示路徑
        mapping：表示檔案
        **表示該目錄下的檔案以及子目錄檔案
     -->
    <mvc:resources location="/css/" mapping="/css/**" />
    <mvc:resources location="/images/" mapping="/images/**" />
    <mvc:resources location="/js/" mapping="/js/**" />

    <!-- 配置spring開啟注解mvc的支持-->
    <mvc:annotation-driven></mvc:annotation-driven>
</beans>

1.4、在web.xml中添加配置

<!DOCTYPE web-app PUBLIC
 "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN"
 "http://java.sun.com/dtd/web-app_2_3.dtd" >

<web-app>
  <display-name>Archetype Created Web Application</display-name>
  <!-- SpringMVC的核心控制器 -->
  <servlet>
    <servlet-name>dispatcherServlet</servlet-name>
    <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
    <!-- 配置Servlet的初始化引數，讀取springmvc的組態檔，創建spring容器 -->
    <init-param>
      <param-name>contextConfigLocation</param-name>
      <param-value>classpath:springmvc.xml</param-value>
    </init-param>
    <!-- 配置servlet啟動時加載物件 -->
    <load-on-startup>1</load-on-startup>
  </servlet>
  <servlet-mapping>
    <servlet-name>dispatcherServlet</servlet-name>
    <url-pattern>/</url-pattern>
  </servlet-mapping>

  <!-- 解決POST請求亂碼 -->
  <filter>
    <filter-name>characterEncodingFilter</filter-name>
    <filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>
    <init-param>
      <param-name>encoding</param-name>
      <param-value>UTF-8</param-value>
    </init-param>
  </filter>
  <filter-mapping>
    <filter-name>characterEncodingFilter</filter-name>
    <url-pattern>/*</url-pattern>
  </filter-mapping>
</web-app>

1.5、增加jquery檔案

在webapp目錄下新建js目錄，拷貝jquery檔案到該目錄下，

二、回傳值型別

這里的回傳值型別是指控制器方法的回傳值型別，

2.1、字串

Controller方法回傳字串可以指定邏輯視圖的名稱，根據視圖決議器為物理視圖的地址，

2.1.1、撰寫控制器類

package org.codeaction.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;

@Controller
public class ResultController {
    @RequestMapping("/testString")
    public String testString() {
        System.out.println("hello...");
        return "success";
    }
}

2.1.2、撰寫相關頁面

index.jsp，在webapp目錄下

<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<html>
<body>
    <p>
        <a href="https://www.cnblogs.com/codeaction/p/${pageContext.request.contextPath}/testString">測驗回傳字串</a>
    </p>
</body>
</html>

這里有一個超鏈接，用來訪問控制器類，

在WEB-INF目錄下創建pages目錄，撰寫success.jsp

<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<html>
    <head>
        <title>SUCCESS</title>
    </head>
    <body>
        <h1>Success</h1>
    </body>
</html>

2.1.3、啟動tomcat服務器測驗

在idea中配置tomcat服務器，運行，

在地址欄輸入http://localhost:8080/result/index.jsp，點擊彈出頁面中的超鏈接，頁面顯示Success，

2.2、void

如果控制器的方法回傳值撰寫成void，執行程式報404的例外，默認查找JSP頁面沒有找到，

可以通過在控制器方法系結ServletAPI的方式系結request和response，實作轉發、重定向、回應特定資料，

2.2.1、在控制器類中添加方法

在ResultController中添加如下的方法

    @RequestMapping("/testVoid")
    public void testVoid(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        System.out.println("void...");
        //1.轉發
        //request.getRequestDispatcher("/WEB-INF/pages/success.jsp").forward(request, response);
        //2.重定向
        //response.sendRedirect(request.getContextPath() + "/testString");
        //3.向瀏覽器回傳資料
        PrintWriter out = response.getWriter();
        out.println("hahahahaha....");
    }

1、2、3是三個功能，測驗的時候要分別測驗，

2.2.2、撰寫相關頁面

在index.jsp中添加如下內容

<p>
    <a href="https://www.cnblogs.com/codeaction/p/${pageContext.request.contextPath}/testVoid">測驗回傳void</a>
</p>

2.3、ModelAndView

ModelAndView是SpringMVC為我們提供的一個物件，該物件可以用作控制器方法的回傳值，

2.3.1、在控制器類中添加方法

在ResultController中添加如下的方法

@RequestMapping("/testModelAndView")
public ModelAndView testModelAndView() {
    //創建ModelAndView物件
    ModelAndView mv = new ModelAndView();

    //創建User物件
    User user = new User();
    user.setName("Tom");
    user.setAge(10);

    //在request域中存放名為user的物件
    mv.addObject("user", user);
    //設定邏輯視圖名稱
    mv.setViewName("success");

    //回傳ModelAndView
    return mv;
}

注意：這里在ModelAndView中添加的物件是保存在了request域當中，

2.3.2、修改相關頁面

在index.jsp中添加如下內容

<p>
    <a href="https://www.cnblogs.com/codeaction/p/${pageContext.request.contextPath}/testModelAndView">測驗回傳ModelAndView</a>
</p>

在success.jsp中添加如下內容

<p>name:${requestScope.user.name}</p>
<p>age:${requestScope.user.age}</p>

2.3.3、啟動tomcat服務器測驗

點擊超鏈接，瀏覽器顯示如下

Success
name:Tom
age:10

三、轉發和重定向

目前已知的轉發方式：

通過控制器方法系結ServletAPI的方式系結request，通過request實作轉發；
通過回傳ModelAndView，設定View實作轉發，

目前已知的重定向方式：

通過控制器方法系結ServletAPI的方式系結response，通過response實作轉發，

除了上面的方式，也可以SpringMVC框架提供的方式進行轉發和重定向，

3.1、轉發

新建控制器類

package org.codeaction.controller;

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;

@Controller
public class JumpController {

    //轉發
    @RequestMapping("/testForward")
    public String testForward() {
        System.out.println("testForward...");
        return "forward:/WEB-INF/pages/success.jsp";
    }
}

通過forward關鍵字實作轉發，由于這里不走視圖決議器了，需要寫完整的路徑，

3.2、重定向

在控制器類JumpController中添加如下方法

//重定向
@RequestMapping("/testRedirect")
public String testRedirect() {
    System.out.println("testRedirect");
    return "redirect:/testString";
}

3.3、修改相關頁面

在index.jsp中添加如下內容

<p>
	<a href="https://www.cnblogs.com/codeaction/p/${pageContext.request.contextPath}/testForward">測驗轉發</a>
</p>
<p>
	<a href="https://www.cnblogs.com/codeaction/p/${pageContext.request.contextPath}/testRedirect">測驗重定向</a>
</p>

啟動tomcat服務器，分別點擊兩個超鏈接，實作轉發和重定向的功能，

四、ResponseBody回應JSON資料

作用：將Controller的方法回傳的物件，通過HttpMessageConverter介面轉換為指定格式的資料，

前提：需要在pom.xml中加入jackson的包，我們之前的環境搭建中已經添加了相應坐標，

4.1、撰寫控制器類

package org.codeaction.controller;

import org.codeaction.bean.User;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;

@Controller
public class JsonController {

    @RequestMapping("/testJSON")
    @ResponseBody
    public User testJSON(@RequestBody User user) {
        System.out.println(user);
        return user;
    }
}

4.2、修改相關頁面

修改index.jsp，引入jQuery，添加JS代碼，如下：

<script src="https://www.cnblogs.com/codeaction/p/${pageContext.request.contextPath}/js/jquery.min.js"></script>
<script>
    $(function () {
    $("#btn").click(function () {
        $.ajax({
            url: "${pageContext.request.contextPath}/testJSON",
            contentType: "application/json;charset=UTF-8",
            data: '{"name":"Tom","age":20}',
            dataType: "JSON",
            type: "POST",
            success: function(data) {
                console.log(data);
            }
        });
    });
});
</script>

添加觸發JS操作的按鈕

<p>
    <button id="btn" type="button">測驗回傳JSON資料</button>
</p>

轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/161010.html

標籤：Java

上一篇：JAVA自學筆記（6）—例外、執行緒、函式式編程

下一篇：Spring的核心思想，總結得非常好！