为什么后端接受的是乱码

我通过post方法传递数据，现在为什么servlet接受的数据是乱码？

package com.imooc.servlet;

import java.io.IOException;
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 org.json.JSONObject;

@WebServlet("/ManageServlet")
public class ManageServlet extends HttpServlet {
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		String name=request.getParameter("flag");
		System.out.println(name);
		JSONObject json=null;
		if(name.equals("员工列表")){
			json=new JSONObject("{html:小红<br>小明<br>小白}");
		} else if(name.equals("职位列表")){
			json=new JSONObject("{html:职工<br>经理}");
		} else {
			json=new JSONObject("{html:人事部<br>技术部<br>无线事业部}");
		}
		response.getOutputStream().write(json.toString().getBytes("UTF-8"));
	}

	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		doGet(request, response);
	}

}

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="resource/js/jquery-3.3.1.js"></script>
<%
	String basePath=request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+request.getContextPath()+"/";
%>
</head>
<body>
	<input type="button" value="员工列表" onclick="showYG()" id="YG">
	<input type="button" value="职位列表" onclick="showZW()" name="ZW">
	<input type="button" value="部门列表" onclick="showOU()" name="OU">
	<div id="content"></div>
</body>
<script>
	function showYG(){
		var xmlHttp=new XMLHttpRequest();
		var params="flag="+$("input[name=ZW]").val();
		xmlHttp.open("POST","<%=basePath %>/ManageServlet",true);
		xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
		xmlHttp.send(params);
		xmlHttp.onreadystatechange=function(){
			if(xmlHttp.readyState=="4"&&xmlHttp.status=="200"){
				var result=xmlHttp.responseText;
				document.getElementById("content").innerHTML=result;
			}
		}
	}
	
	function showZW(){
		var xmlHttp=new XMLHttpRequest();
		var params="flag="+$("input[name=ZW]").val();
		xmlHttp.open("post", "<%=basePath %>/ManageServlet", true);
		xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
		xmlHttp.send(params);
		xmlHttp.onreadystatechange=function(){
			if(xmlHttp.readyState=="4"&&xmlHttp.status=="200"){
				var result=xmlHttp.responseText;
				document.getElementById("content").innerHTML=result;
			}
		}
	}
	
	function showOU(){
		var xmlHttp=new XMLHttpRequest();
		var params="flag="+$("input[name=OU]").val();
		xmlHttp.open("post", "<%=basePath %>/ManageServlet", true);
		xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
		xmlHttp.send(params);
		xmlHttp.onreadystatechange=function(){
			if(xmlHttp.readyState=="4"&&xmlHttp.status=="200"){
				var result=xmlHttp.responseText;
				document.getElementById("content").innerHTML=result;
			}
		}
	}
</script>
</html>

请老师指点一下

风中随影 2018-11-09

源自：Ajax入门 3-3 自由编程

收起

1回答

一叶知秋519 2018-11-09 18:11:18

1、后端接收乱码：

对name以ISO-8859-1进行解码，然后再对其以UTF-8的形式进行重新编码，即

name = new String(name.getBytes("ISO-8859-1"),"UTF-8");

这样再打印name时，就不会出现乱码了。

2、关于同学代码的几点建议：

1）获取员工时，

应该将input标签内的id="YG"改为name="YG"

在showYG()方法中，红框内应该是name=YG

2）由于是使用JavaScript版本的Ajax，接受返回数据时，是通过

var result=xmlHttp.responseText;

responseText 获取到的是字符串

所以在Servlet中直接回传String类型的数据就可以啦~

即

通过上面的修改以后，同学的代码就符合作业要求了。

如果解决了你的疑惑，请采纳，祝学习愉快！

收起回答

提问者风中随影 #1

那如果存在多个数据，需要用json来进行返回的话应该怎么在前台进行解析呢？请老师指点一下

2018-11-10 10:41:27
提问者风中随影 #2

还有为什么我在jsp中写的是utf-8的字符编码，为什么在后台还要进行一次校验呢？

2018-11-10 10:42:25
一叶知秋519 回复提问者风中随影 #3

传递多组数据同学可以使用jQuery形式的Ajax，针对json的解析使用起来更加方便，具体同学可以查看教辅区《JSONArray使用实例》；关于编码的问题，页面中书写的编码规定了页面显示编码和存储编码，但是当发生请求时会经过服务器的转发，所以就会发生乱码了，在后面的章节我们会学到过滤器，使用编码过滤器的方式来解决乱码，这个地方同学可以暂时使用上面提供的方式来解决中文传输过程中发生的乱码问题。祝学习愉快！

2018-11-11 15:06:45