SpringMVC 03: 請求和響應的亂碼解決 + SpringMVC響應Ajax請求

請求或響應的中文亂碼問題

  • tomcat9解決了get請求和響應的中文亂碼問題，但是沒有解決post請求或響應的中文亂碼問題

  • tomcat10解決了get和post請求以及響應的中文亂碼問題

  • 考慮到實際項目中伺服器的更新速度(短時間不會都採用tomcat10)為了項目的通用性和可靠性，最好為請求和響應添加應對中文亂碼的方案

  • 通過在web.xml中配置編碼過濾器，對符合通配請求條件的請求可以進行自定義的編碼設置

  • 編碼過濾器一般在web.xml文件中進行其他配置之前配置，儘早解決可能出現的中文亂碼問題

  • web.xml中新增對編碼過濾器的配置

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="//xmlns.jcp.org/xml/ns/javaee"
         xmlns:xsi="//www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="//xmlns.jcp.org/xml/ns/javaee //xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"
         version="4.0">

    <!-- 配置編碼過濾器 -->
    <filter>
        <filter-name>encode</filter-name>
        <!-- 底層使用的過濾器 -->
        <filter-class>org.springframework.web.filter.CharacterEncodingFilter</filter-class>
        <!--
            (ctrl + alt + 點擊上述CharacterEncodingFilter，查看源程式碼，可以看到需要以下參數)
            private String encoding;
            private boolean forceRequestEncoding;
            private boolean forceResponseEncoding
        -->
        <!-- 向底層過濾器的參數賦值，進行編碼的自定義配置 -->
        <init-param>
            <param-name>encoding</param-name>
            <!-- 建議大寫，小寫有時解析不出來-->
            <param-value>UTF-8</param-value>
        </init-param>
        
        <init-param>
            <!-- 對請求的編碼解析採用encoding變數中的編碼方式-->
            <param-name>forceRequestEncoding</param-name>
            <param-value>true</param-value>
        </init-param>
        
        <init-param>
            <!-- 對響應的編碼解析採用encoding變數中的編碼方式-->
            <param-name>forceResponseEncoding</param-name>
            <param-value>true</param-value>
        </init-param>
    </filter>
    
    <filter-mapping>
        <filter-name>encode</filter-name>
        <!-- 指定對哪些請求進行過濾並進行編碼配置處理-->
        <url-pattern>/*</url-pattern>
    </filter-mapping>
    
</web-app>

控制器中action方法的返回值

  • 控制器中的方法名稱不一定含有action單詞，但是一般習慣於把控制器中的方法稱為action方法

  • 返回String：設置了視圖解析器之後，可以自動拼接前綴和後綴，來作為客戶端請求的資源地址，完成響應頁面的跳轉。還可以拼接字元串，返回指定的路徑

  • 返回Object：使用jackson工具(要添加jackson的依賴)進行轉換，自動將對象或者集合轉為json格式的數據並返回

  • 返回void：無返回值，一般用於ajax請求

  • 返回基本數據類型：用於ajax請求

  • ModelAndView：返回數據和視圖對象(現在用的較少)

響應ajax請求

  • 與前面SpringMVC部落格集中的SpringMVC(指SpringMVC 02)項目相比，新增的配置如下
  • 在pom.xml中添加jackson依賴，為了可以利用SpringMVC自動返回json格式的數據
    <!-- 添加jackson的依賴-->
    <dependency>
      <groupId>com.fasterxml.jackson.core</groupId>
      <artifactId>jackson-databind</artifactId>
      <version>2.13.3</version>
    </dependency>
  • 在webapp/js目錄下添加jQuery函數庫，為了前端可以使用jQuery封裝的ajax()方法，便捷的發送ajax請求
  • webapp/index.jsp如下，是發送ajax請求並回顯後端返回數據的前端介面
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>index.jsp</title>
    <script src="js/jquery-3.6.1.js"></script>
</head>
<body>
    
<a href="javascript:showUser()">發送ajax請求，獲取用戶資訊列表</a><br>

<div id="userDiv">div，用來顯示伺服器返回的數據</div>

<script type="text/javascript">
    function showUser() {
        //使用jQuery封裝的ajax()發送ajax請求
        $.ajax({
            url:"${pageContext.request.contextPath}/list.action",
            type:"get",
            dataType:"json",
            success:function (userList){
                var data = ""
                $.each(userList, function (i, user){
                    data += user.name + " ---- " + user.age + "<br>"
                })
                //將拼接好的數據回顯在div中
                $("#userDiv").html(data)
              }
            }
        )
    }
</script>
</body>
</html>
  • 新增控制器AjaxRequestAction，action方法上添加註解@ResponseBody，該註解專門用來解析ajax請求
package com.example.controller;

import com.example.pojo.User;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.ResponseBody;

import java.util.ArrayList;
import java.util.List;

@Controller
public class AjaxRequestAction {
    
    //只有當請求路徑和ajax請求類型都對上時，目標方法才會被調用
    @RequestMapping("/list")
    @ResponseBody
    public List<User> ajaxRequest(){//User類含有屬性:name(String), age(int)，無參和全參構造方法，全屬性的getter,setter,toString方法
        List<User> users = new ArrayList<>();
        User u1 = new User("荷包蛋", 20);
        User u2 = new User("餃子", 21);
        User u3 = new User("橘子", 22);
        users.add(u1);
        users.add(u2);
        users.add(u3);
        return users;//SpringMVC框架會自動將對象數組轉化為json數據格式返回給前端ajax請求
    }
}
  • 在springmvc.xml文件需要新增註解驅動< mvc:annotationdriven /> ，為了用他來解析@ResponseBody註解，響應ajax請求
<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="//www.springframework.org/schema/beans"
       xmlns:xsi="//www.w3.org/2001/XMLSchema-instance"
       xmlns:context="//www.springframework.org/schema/context"
       xmlns:mvc="//www.springframework.org/schema/mvc"
       xsi:schemaLocation="//www.springframework.org/schema/beans //www.springframework.org/schema/beans/spring-beans.xsd //www.springframework.org/schema/context //www.springframework.org/schema/context/spring-context.xsd //www.springframework.org/schema/mvc //www.springframework.org/schema/mvc/spring-mvc.xsd">

    <!-- 添加包掃描-->
    <context:component-scan base-package="com.example.controller"/>

    <!-- 這裡暫時不需要配置視圖解析器，因為這裡響應ajax請求，直接將請求到的數據以json格式返回給前端-->

    <!-- 對專門響應ajax請求的註解進行註解的驅動註冊-->
    <mvc:annotation-driven/>
</beans>
  • 部署並啟動tomcat測試
  • 網站首頁(left)，發送ajax請求後的首頁(right)如下：從後端獲取到的數據經前端ajax拼接處理並填充在div中顯示

image

Tags:

VirMach 便宜 VPS

QNews

QNews