Ajax通过POST方法发送中文信息乱码解决

Ajax 前端之家
前端之家收集整理的这篇文章主要介绍了Ajax通过POST方法发送中文信息乱码解决，前端之家小编觉得挺不错的，现在分享给大家，也给大家做个参考。

开发项目用Ajax的Post方法提交信息到请求的servlet，输出遇到中文乱码，纠结了好几天，总结了网络上很多高手的心得，用了两步解决了乱码：

  1. 在JS端，对提交的字符串进行两次编码：
    @H_502_6@ Js代码 @L_301_0@
    1. <%@pagecontentType=@H_403_12@"text/html"pageEncoding=@H_403_12@"gbk"%>
    2. <!DOCTYPEHTMLPUBLIC@H_403_12@"-//W3C//DTDHTML4.01Transitional//EN"
    3. @H_403_12@"http://www.w3.org/TR/html4/loose.dtd">
    5. <html>
    6. <head>
    7. <Metahttp-equiv=@H_403_12@"Content-Type"content=@H_403_12@"text/html;charset=gbk">
    8. <title>JSPPage</title>
    9. <scripttype=@H_403_12@"text/javascript">
    10. varreq;
    11. functionvalidate(){
    12. //获取表单提交的内容
    13. varidField=document.getElementById(@H_403_12@"userName").value;
    14. //要发送的字符串数据
    15. varcontent=@H_403_12@"id=hello&message="+idField+@H_403_12@"&say=我是帅哥";
    16. //重点：对content含中文字符的字符串进行两次编码
    17. content=encodeURI(content);
    18. varurl=@H_403_12@"validate.do";
    19. //创建一个XMLHttpRequest对象req
    20. if(window.XMLHttpRequest){
    21. //IE7,Firefox,Opera支持
    22. req=newXMLHttpRequest();
    23. }elseif(window.ActiveXObject){
    24. //IE5,IE6支持
    25. newActiveXObject(@H_403_12@"Microsoft.XMLHTTP");
    26. }
    27. req.open(@H_403_12@"post",url,true);
    28. req.setRequestHeader(@H_403_12@"Content-Type",@H_403_12@"application/x-www-form-urlencoded");
    29. req.onreadystatechange=callback;
    30. //send函数发送请求，参数
    31. req.send(content);
    32. functioncallback(){
    33. //alert(req.readyState);
    34. //alert(req.status);
    35. if(req.readyState==4&&req.status==200){
    36. //alert(req.responseText);
    37. varcheck=req.responseText;
    38. show(check);
    39. functionshow(str){
    40. document.getElementById(@H_403_12@"info").innerHTML=str;
    41. </script>
    42. </head>
    43. <body>
    44. <h1>TestAjax</h1><p>
    45. <formaction=@H_403_12@""method=@H_403_12@"get"name=@H_403_12@"form">
    46. <br>
    47. 输入用户名：
    48. <inputtype=@H_403_12@"text"size=@H_403_12@"10"maxlength=@H_403_12@"8"id=@H_403_12@"userName"name=@H_403_12@"name"onblur=@H_403_12@"validate()">
    49. <spanid=@H_403_12@"info"></span>
    50. 输入商品名：
    51. <inputtype=@H_403_12@"submit"name=@H_403_12@"refer">
    52. </form>
    53. </body>
    54. </html>
  • 在servlet端，对接收的数据的进行一次解码：
    @H_502_6@ Java代码 @L_301_0@
      packagecom.model;
    1. importjava.io.IOException;
    2. importjava.io.PrintWriter;
    3. importjava.util.Enumeration;
    4. importjavax.servlet.ServletException;
    5. importjavax.servlet.http.HttpServlet;
    6. importjavax.servlet.http.HttpServletRequest;
    7. importjavax.servlet.http.HttpServletResponse;
    8. importjava.net.URLDecoder;
    9. /**
    10. *
    11. *@authorGavin
    12. */
    13. publicclassDoAjaxServletextendsHttpServlet{
    14. protectedvoidprocessRequest(HttpServletRequestrequest,HttpServletResponseresponse)
    15. throwsServletException,IOException{
    16. response.setContentType(@H_403_12@"text/html;charset=gbk");
    17. request.setCharacterEncoding(@H_403_12@"gbk");
    18. PrintWriterout=response.getWriter();
    19. try{
    20. response.setHeader(@H_403_12@"Cache-Control",@H_403_12@"no-store");
    21. response.setHeader(@H_403_12@"Pragma",@H_403_12@"no-cache");
    22. response.setDateHeader(@H_403_12@"Expires",0);
    23. //这里有个小问题：如果写成Stringput=null;将会输出一个null后面再加上增加的字符
    24. Stringput=@H_403_12@"";
    25. for(Enumeration<String>e=request.getParameterNames();e.hasMoreElements();){
    26. Stringh=(String)e.nextElement();
    27. Stringc=(String)request.getParameter(h);
    28. put+=c;
    29. //重点在这里，对接受到的信息进行解码
    30. StringputDecoded=java.net.URLDecoder.decode(put,@H_403_12@"utf-8");
    31. System.out.println(pute);
    32. out.write(@H_403_12@"messageis:"+putDecoded);
    33. finally{
    34. out.close();
    35. @Override
    36. voiddoGet(HttpServletRequestrequest,250); line-height:18px"> processRequest(request,response);
    37. voiddoPost(HttpServletRequestrequest,85); font-weight:bold">publicStringgetServletInfo(){
    38. return@H_403_12@"Shortdescription";
    39. }//</editor-fold>
    40. }

    • 猜你在找的Ajax相关文章

    网页的异步请求（Ajax）
    JS原生Ajax操作(XMLHttpRequest) GET请求 POST请求 兼容性问题 利用iframe模拟ajax 实现表...
    手动实现AJAX
    AJAX 每日更新前端基础，如果觉得不错，点个star吧 &#128515; https://github.com/Win...
    axios异步提交表单数据的不同形式
    踩坑Axios提交form表单几种格式 前后端分离的开发前后端, 前端使用的vue,后端的安全模块使...
    php的ajax简单实例
    很早就听闻ajax的名声，但是却一直不知道怎么用，今天自己捣鼓了一下，竟然会用了，哈哈哈...
    Json与Ajax(注册实例）
    需要在服务器上进行哈 jquery的ajax方法： // jquery请求 $.ajax({ url: &quot;./serv...
    jSon和Ajax登录功能，ajax数据交互案例
    ajax实例，检测用户与注册 检测用户名是否被占用： 在用户填写完用户名之后，ajax会异步向...
    关于AjaxControlToolkit的样式问题
    网(LieHuo.Net)教程 技术文章一直都是转载的,从来没有自创过.终于遇到AjaxControlToolkit,...
    一个简单的AJAX实现(HELLO AJAX)
    客户端部分： <html> <head> <meta http-equiv="Content-Type" ...
    AJAX中文乱码的两类问题及解决之策
    1）发送路径中的参数有中文，在服务器段接收参数值是乱码 例如： var url=”a.jsp?na...
    实例：AJAX返回xml代码如何在网页中显示
    建站学院（LieHuo.Net）文档 今天来学习一篇实例代码教程：AJAX返回xml代码如何在网页中显...
    HTMLHTML5JavaScriptCSSjQueryBootstrapAngularjsTypeScriptVueDojoJsonElectronNode.jsextjsExpress XMLES6AjaxFlashUnityReactFlexAnt DesignWeb前端微信小程序微信公众号
    关闭广告单独headers封装代码提示错误整数正则非0开头跳页出页码antd table提示URL未注册公众号支付vue hash模式iSlider车牌键盘循环图片echarts 双折左右布局DllPlugin对象创建打字游戏圈选两栏云函数蒙版ES2020橱窗无缝滚动轮播色块碰撞组件销毁文档操作