AJAX学习笔记4解决乱码问题

在Tomcat10来说,AJAX GET或者POST接收响应都不存在乱码问题

对于Tomcat9来说

前端测试代码


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>测试AJAX乱码问题</title>
</head>
<body>
<script type="text/javascript">
    window.onload=function (){
        //GET
        document.getElementById("btn1").onclick=function(){
            var xhr=new XMLHttpRequest();
            xhr.onreadystatechange=function (){
                if(this.readyState==4){
                    if(this.status==200){
                        document.getElementById("mydiv").innerHTML=this.responseText
                    }else{
                        alert("请求发送失败")
                    }
                }
            }
            var username=document.getElementById("username").value
            xhr.open("get","/ajax/luanma?username="+username,true)
 
            xhr.send()
        }
        //POST
        document.getElementById("btn2").onclick=function(){
            var xhr=new XMLHttpRequest();
            xhr.onreadystatechange=function (){
                if(this.readyState==4){
                    if(this.status==200){
                        document.getElementById("mydiv").innerHTML=this.responseText
                    }else{
                        alert("请求发送失败")
                    }
                }
            }
            var username=document.getElementById("username").value
            xhr.open("post","/ajax/luanma",true)
            xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded")
            xhr.send("username="+username)
        }
    }
</script>
 
 
<input type="text" id="username">
<button id="btn1">发送AJAX GET请求,测试乱码问题</button>
<button id="btn2">发送AJAX POST请求,测试乱码问题</button>
 
<div id="mydiv"></div>
</body>
</html>

后端测试代码


package com.web;
 
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.io.PrintWriter;
 
/**
 * @author hrui
 * @date 2023/9/4 6:02
 */
@WebServlet("/luanma")
public class AjaxRequestLuanma extends HttpServlet {
 
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        //接收的中文会不会乱码
        String username = req.getParameter("username");
        System.out.println(username);
        //响应中文会乱码吗
        PrintWriter writer = resp.getWriter();
        writer.print("GET响应");
    }
 
    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        //接收的中文会不会乱码
        String username = req.getParameter("username");
        System.out.println(username);
        //响应中文会乱码吗
        PrintWriter writer = resp.getWriter();
        writer.print("POST响应");
    }
}

解决方式


package com.web;
 
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.io.PrintWriter;
import java.sql.ResultSet;
 
/**
 * @author hrui
 * @date 2023/9/4 6:02
 */
@WebServlet("/luanma")
public class AjaxRequestLuanma extends HttpServlet {
 
    @Override
    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        //接收的中文会不会乱码
        String username = req.getParameter("username");
        System.out.println(username);
        //响应中文会乱码吗
        resp.setContentType("text/html;charset=utf-8");
        PrintWriter writer = resp.getWriter();
        writer.print("GET响应");
    }
 
    @Override
    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
        //接收的中文会不会乱码
        req.setCharacterEncoding("utf-8");//解决body体乱码问题
        String username = req.getParameter("username");
        System.out.println(username);
        //响应中文会乱码吗
        resp.setContentType("text/html;charset=utf-8");
        PrintWriter writer = resp.getWriter();
        writer.print("POST响应");
    }
}

相关阅读:
LabVIEW比较LabVIEW类对象 LabVIEW接口
 如何解决 Critical dependency: the request of a dependency is an expression ？
jQuery—validate验证框架的简单使用
 JavaScript面向对象学习递归（三）
react源码中的协调与调度
 三车道交通流元胞自动机研究（matlab代码实现）
灵活好用的sql monitoring 脚本 part4
Vue-----循环渲染
 springboot毕设项目校园运动会管理系统6wumc（java+VUE+Mybatis+Maven+Mysql）
【底层服务/编程功底系列】「大数据算法体系」带你深入分析MapReduce算法 — Shuffle的执行过程
原文地址：https://blog.csdn.net/tiantiantbtb/article/details/132660943