jQuery Ajax传值到Servlet出现乱码问题的解决方法


Posted in Javascript onOctober 09, 2016

最近在学jquery ui,在做一个小功能的时候需要将前台的值获取到,通过Ajax传递给Servlet,然后再在返回数据结果,但是在Servlet接受参数的时候,通过后台打印,发现接受乱码,代码示例如下:

public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html;charset=utf-8");
request.setCharacterEncoding("utf-8");
PrintWriter out = response.getWriter();
String testword=request.getParameter("criticalword")
System.out.println(testword);
out.println(testword);
out.flush();
out.close();
}

我只用的是ajax的get方式传递的,所以上面也只截取了doGet()方法的代码,那么对于乱码,会有哪几种情况呢,我谈一下我的看法,具体每个阶段的方法我会以代码和截图的方式给出:

1.保证jsp网页没有乱码

首先得确保你的JSP页面没有乱码,具体代码如下:

%@page pageEncoding="utf-8" contentType="text/html;charset=utf-8" %

这句话添加在网页最顶部就可以了,补充下page指令的两个参数的具体含义,很多人也许会用,但是我觉得还是有必要了解下的:

a.pageEncoding参数

pageEncoding属性用来指定JSP页面的字符编码,默认为ISO-8859-1,由于该方法不支持中文,所以,如果要指定JSP页面的字符编码方式支持中文编码,则需要将page指令的pageEncoding属性设置为"GB2312"、"GBk"或"UTF-8"。

b.contentType参数

contentType属性用来指定JSP页面输出内容的类型和字符编码方式。属性值中的内容类型部分可以为text/html(纯文本HTML页面)、text/plain(纯文本文件)等。

2.保证jQuery Ajax在传递前没有乱码

下面贴出的Ajax代码,我要给后台传递的参数是get类型,参数名叫criticalword,代码如下:

$('#search').autocomplete({
source:function(request,response){

 alert('看看在传递前有没有乱码'+request.term);
$.ajax({
type:'get',
url:'/SGAME/servlet/IndexSearchItems',
data:{criticalword:encodeURI(request.term)},
success:function(response,status,xhr){
alert(response);
}
});
},
delay:100
})

正如我代码红色所标记的,你在传递前先alert()弹窗,测测看是不是你的js文件已经乱码,如果是的话,解决方法:

1.回查上一步是不是没解决

2.js文件编码问题:在资源管理器用记事本打开js,然后另存为,在编码里选择utf-8

如下图:

jQuery Ajax传值到Servlet出现乱码问题的解决方法

当你的第一个弹窗没有乱码,那说明在传给Servlet前没有问题,那个在进入下一步前先做一个准备工作,如上述红色代码所示,先给参数转码:

criticalword:encodeURI(request.term)

  这个转码是为了防止在Servlet中出现接收乱码的函数,形式为:encodeURI(param)

3.保证Servlet在接受Ajax的参数时(request)没有乱码

到了这一步说明你离成功不远了,只需要先request和resopnse设置编码的方式,然后再解码即可,doGet代码如下:

public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html;charset=utf-8");
request.setCharacterEncoding("utf-8");
PrintWriter out = response.getWriter();
String testword=URLDecoder.decode(request.getParameter("criticalword"),"utf-8");
System.out.println(testword);
out.println(testword);
out.flush();
out.close();
}

  其中主要有三个要点:

a.response.setContentType():用于设置响应回jsp或者Ajax的字符编码。

b.request.setCharacterEncoding():用于设置接收请求的响应编码。

c.URLDecoder.decode():此函数需要先导入java.net包,用于对Ajax的编码进行解码。

完成以上三个步骤后,你可以像我一样,在返回前加一个System.out.println(yourParam)试试,如果是中文那就没问题啦

4.保证Servlet在响应(response)给jsp没有乱码

 其实在第三部的要点b设置好后,其实返回给html或jsp就应该之中文了。

注:如果你用的是post方法,直接在Ajax里加上contentType:application/x-www-form-urlencoded;charset=utf-8就可以了,不需要进行转码。

Javascript 相关文章推荐
PNGHandler-借助JS让PNG图在IE下实现透明(包括背景图)
Aug 31 Javascript
浅谈checkbox的一些操作(实战经验)
Nov 20 Javascript
jQuery移除tr无效的解决方法(tr是动态添加)
Sep 22 Javascript
javascript中clone对象详解
Dec 03 Javascript
jquery validate和jquery form 插件组合实现验证表单后AJAX提交
Aug 26 Javascript
js计算文本框输入的字符数
Oct 23 Javascript
express文件上传中间件Multer详解
Oct 24 Javascript
9个让JavaScript调试更简单的Console命令
Nov 14 Javascript
vue插件draggable实现拖拽移动图片顺序
Dec 01 Javascript
vue实现数据控制视图的原理解析
Jan 07 Javascript
js实现双人五子棋小游戏
May 28 Javascript
Vue中登录验证成功后保存token,并每次请求携带并验证token操作
Sep 08 Javascript
BootStrap中Table分页插件使用详解
Oct 09 #Javascript
微信小程序 for 循环详解
Oct 09 #Javascript
微信小程序 条件渲染详解
Oct 09 #Javascript
手机浏览器 后退按钮强制刷新页面方法总结
Oct 09 #Javascript
最实用的jQuery分页插件
Oct 09 #Javascript
js本地图片预览实现代码
Oct 09 #Javascript
js html css实现复选框全选与反选
Oct 09 #Javascript
You might like
综合图片计数器
2006/10/09 PHP
如何用PHP实现插入排序?
2013/04/10 PHP
thinkphp获取栏目和文章当前位置的方法
2014/10/29 PHP
PHP的Laravel框架结合MySQL与Redis数据库的使用部署
2016/03/21 PHP
PHP正则表达式笔记与实例详解
2019/05/09 PHP
php使用自带dom扩展进行元素匹配的原理解析
2020/05/29 PHP
jQuery 一个图片切换的插件
2011/10/09 Javascript
最短的javascript:地址栏载入脚本代码
2011/10/13 Javascript
jQuery javaScript捕获回车事件(示例代码)
2013/11/07 Javascript
Javascript之this关键字深入解析
2013/11/12 Javascript
JavaScript中的条件判断语句使用详解
2015/06/03 Javascript
深入浅出讲解ES6的解构
2016/08/03 Javascript
JS公共小方法之判断对象是否为domElement的实例
2016/11/25 Javascript
jquery Ajax 全局调用封装实例详解
2017/01/16 Javascript
JSON数据中存在单个转义字符“\”的处理方法
2018/07/11 Javascript
[01:01:43]EG vs VP 2018国际邀请赛淘汰赛BO3 第二场 8.24
2018/08/25 DOTA
Python自定义类的数组排序实现代码
2016/08/28 Python
Django项目实战之用户头像上传与访问的示例
2018/04/21 Python
Python 3.6打包成EXE可执行程序的实现
2019/10/18 Python
如何修复使用 Python ORM 工具 SQLAlchemy 时的常见陷阱
2019/11/19 Python
python使用python-pptx删除ppt某页实例
2020/02/14 Python
解决Python发送Http请求时,中文乱码的问题
2020/04/30 Python
Adobe Html5 Extension开发初体验图文教程
2017/11/14 HTML / CSS
亚马逊墨西哥站:Amazon.com.mx
2018/08/26 全球购物
主要的Ajax框架都有什么
2013/11/14 面试题
打架检讨书2000字
2014/02/22 职场文书
推荐信怎么写
2014/05/09 职场文书
小组名称和口号
2014/06/09 职场文书
应聘教师自荐书
2014/06/16 职场文书
四年级小学生评语
2014/12/26 职场文书
员工辞职信怎么写
2015/02/27 职场文书
敬老院义诊活动总结
2015/05/07 职场文书
2015年档案室工作总结
2015/05/23 职场文书
大一新生军训新闻稿
2015/07/17 职场文书
用 Python 元类的特性实现 ORM 框架
2021/05/19 Python
对讲机知识
2022/04/07 无线电