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 相关文章推荐
使用TextRange获取输入框中光标的位
Oct 14 Javascript
获取select元素被选中的文本内容的js代码
Jan 29 Javascript
jquery实现点击消失的代码
Mar 03 Javascript
理解javascript闭包
Dec 15 Javascript
简单实现的JQuery文本框水印插件
Jun 14 Javascript
JavaScript中数组slice和splice的对比小结
Sep 22 Javascript
使用JS代码实现点击按钮下载文件
Nov 12 Javascript
基于jquery日历价格、库存等设置插件
Jul 05 jQuery
Vue网页html转换PDF(最低兼容ie10)的思路详解
Aug 24 Javascript
微信小程序实现左滑修改、删除功能
Oct 19 Javascript
ES6中字符串的使用方法扩展
Jun 04 Javascript
Node.js HTTP服务器中的文件、图片上传的方法
Sep 23 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
snoopy PHP版的网络客户端提供本地下载
2008/04/15 PHP
PHP实现手机归属地查询API接口实现代码
2012/08/27 PHP
PHP的Yii框架中Model模型的学习教程
2016/03/29 PHP
Yii框架中sphinx索引配置方法解析
2016/10/18 PHP
PHP递归获取目录内所有文件的实现方法
2016/11/01 PHP
Js日期选择自动填充到输入框(界面漂亮兼容火狐)
2013/08/02 Javascript
jquery放大镜效果超漂亮噢
2013/11/15 Javascript
Dojo Javascript 编程规范 规范自己的JavaScript书写
2014/10/26 Javascript
基于jQuery实现拖拽图标到回收站并删除功能
2015/11/25 Javascript
值得分享的Bootstrap Ace模板实现菜单和Tab页效果
2015/12/30 Javascript
JS简单获取及显示当前时间的方法
2016/08/03 Javascript
Javascript将JSON日期格式化
2016/08/23 Javascript
Javascript动画效果(3)
2016/10/11 Javascript
Bootstrap3 内联单选和多选框
2016/12/29 Javascript
打通前后端构建一个Vue+Express的开发环境
2018/07/17 Javascript
JS隐藏号码中间4位代码实例
2019/04/09 Javascript
js中let能否完全替代IIFE
2019/06/15 Javascript
VSCode launch.json配置详细教程
2020/06/18 Javascript
JS实现简单贪吃蛇小游戏
2020/10/28 Javascript
使用python实现baidu hi自动登录的代码
2013/02/10 Python
python文件写入实例分析
2015/04/08 Python
使用python实现个性化词云的方法
2017/06/16 Python
Python利用pandas计算多个CSV文件数据值的实例
2018/04/19 Python
python的继承知识点总结
2018/12/10 Python
Python使用pandas对数据进行差分运算的方法
2018/12/22 Python
python后端接收前端回传的文件方法
2019/01/02 Python
windows 10 设定计划任务自动执行 python 脚本的方法
2019/09/11 Python
Django框架ORM数据库操作实例详解
2019/11/07 Python
商场拾金不昧表扬信
2014/01/13 职场文书
前台文员职责范本
2014/03/07 职场文书
不错的求职信范文
2014/07/20 职场文书
后勤工作个人总结
2015/02/28 职场文书
2015年发展党员工作总结报告
2015/03/31 职场文书
写给医护人员的一封感谢信
2019/09/16 职场文书
Python实现滑雪小游戏
2021/09/25 Python
如何利用python实现Simhash算法
2022/06/28 Python