前端页面乱码问题

最新推荐文章于 2024-06-19 11:52:32 发布

Acndy233

最新推荐文章于 2024-06-19 11:52:32 发布

阅读量1.5k

点赞数

分类专栏： Spring笔记文章标签：前端 java jsp filter

本文链接：https://blog.csdn.net/zhangsann_6/article/details/120889631

版权

Spring笔记专栏收录该内容

11 篇文章 0 订阅

订阅专栏

本文详细介绍了在Web项目中遇到的表单数据乱码问题及其解决方案。通过在web.xml配置SpringMVC的CharacterEncodingFilter或者自定义过滤器设置字符编码，确保前端与后端数据交互时的字符集统一，从而有效避免中文乱码现象的发生。实践步骤包括前端表单创建、Controller处理、页面展示以及过滤器的实现和注册。

摘要由CSDN通过智能技术生成

Form表单乱码

在Web项目中，当前端页面发送表单数据（中文）给Controller时候，处理完之后又发送到前端页面，有时候会产生乱码的情况。
简单粗暴SpringMVC：
在web.xml中配置如下

<!--配置SpringMVC的乱码过滤-->
<filter>
    <filter-name>encoding</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>encoding</filter-name>
    <url-pattern>/*</url-pattern>
</filter-mapping>

这样问题就结束了

如果想自定义解决方法：创建一个过滤器，具体实施

文章目录

1 前端表单页面

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>form</title>
</head>
<body>

<form action="/mvc04/e/test01" method="post">
    <input type="text" name="name">
    <input type="submit">
</form>

</body>
</html>

2 Controller处理数据

package com.xzzlx.controller;

import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.PostMapping;

@Controller
public class Encoding {

    @PostMapping("/e/test01")
    public String test01(String name, Model model){
        model.addAttribute("msg", name);
        return "hello";
    }
}

3 返回hello.jsp页面

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
</head>
<body>

${msg}

</body>
</html>

4 发生乱码

此时出现的效果

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-RspY1TYJ-1634805425624)(img/image-20211021161417376.png)]

5 解决

创建一个过滤器的类

package com.xzzlx.filter;

import javax.servlet.*;
import java.io.IOException;

public class EncodingFilter implements Filter {
    @Override
    public void init(FilterConfig filterConfig) throws ServletException {

    }

    @Override
    public void doFilter(ServletRequest req, 
                         ServletResponse resp, 
                         FilterChain filterChain) 
        				 throws IOException, ServletException {
        req.setCharacterEncoding("utf-8");
        resp.setCharacterEncoding("utf-8");

        filterChain.doFilter(req, resp);
    }

    @Override
    public void destroy() {

    }
}

在web.xml文件中注册过滤器

注册的时候，filter-mapping中应该为/*，不能用/
因为我们的页面是JSP，而/只能扫描所有非JSP文件，/*则可以过滤包括JSP的所有文件

<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee 
                             http://xmlns.jcp.org/xml/ns/javaee/web-app_4_0.xsd"
         version="4.0">
    
    <servlet>
        <servlet-name>springmvc</servlet-name>
        <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
        <init-param>
            <param-name>contextConfigLocation</param-name>
            <param-value>classpath:springmvc-servlet.xml</param-value>
        </init-param>
        <load-on-startup>1</load-on-startup>
    </servlet>
    <servlet-mapping>
        <servlet-name>springmvc</servlet-name>
        <url-pattern>/</url-pattern>
    </servlet-mapping>

    <filter>
        <filter-name>encoding</filter-name>
        <filter-class>com.xzzlx.filter.EncodingFilter</filter-class>
    </filter>
    <filter-mapping>
        <filter-name>encoding</filter-name>
        <url-pattern>/*</url-pattern>
    </filter-mapping>
    
</web-app>