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 相关文章推荐
跟着Jquery API学Jquery之一 选择器
Apr 07 Javascript
jquery 表格排序、实时搜索表格内容(附图)
May 19 Javascript
Nginx上传文件全部缓存解决方案
Aug 17 Javascript
js操作cookie保存浏览记录的方法
Dec 25 Javascript
JS模仿手机端九宫格登录功能实现代码
Apr 28 Javascript
npm国内镜像 安装失败的几种解决方案
Jun 04 Javascript
jQueryMobile之窗体长内容的缺陷与解决方法实例分析
Sep 20 jQuery
vue.js-div滚动条隐藏但有滚动效果的实现方法
Mar 03 Javascript
ES6知识点整理之数组解构和字符串解构的应用示例
Apr 17 Javascript
vue-cli3 配置开发与测试环境详解
May 17 Javascript
新手快速入门JavaScript装饰者模式与AOP
Jun 24 Javascript
vue-drag-chart 拖动/缩放图表组件的实例代码
Apr 10 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
深入eAccelerator与memcached的区别详解
2013/06/06 PHP
PHP图片等比例缩放生成缩略图函数分享
2014/06/10 PHP
CodeIgniter安全相关设置汇总
2014/07/03 PHP
浅谈PDO的rowCount函数
2015/06/18 PHP
php脚本守护进程原理与实现方法详解
2017/07/20 PHP
VBS通过WMI监视注册表变动的代码
2011/10/27 Javascript
Jquery同辈元素选中/未选中效果的实例代码
2013/08/01 Javascript
基于javascript滚动图片具体实现
2013/11/18 Javascript
js实现键盘操作实现div的移动或改变的原理及代码
2014/06/23 Javascript
jQuery中outerHeight()方法用法实例
2015/01/19 Javascript
jQuery判断checkbox选中状态
2016/05/12 Javascript
微信小程序 解决swiper不显示图片的方法
2017/01/04 Javascript
浅谈Vue2.0中v-for迭代语法的变化(key、index)
2018/03/06 Javascript
用VsCode编辑TypeScript的实现方法
2020/05/07 Javascript
为python设置socket代理的方法
2015/01/14 Python
Python中第三方库Requests库的高级用法详解
2017/03/12 Python
Python编程实现正则删除命令功能
2017/08/30 Python
python操作xlsx文件的包openpyxl实例
2018/05/03 Python
numpy返回array中元素的index方法
2018/06/27 Python
Python2 Selenium元素定位的实现(8种)
2019/02/25 Python
Python实现账号密码输错三次即锁定功能简单示例
2019/03/29 Python
python + selenium 刷B站播放量的实例代码
2020/06/12 Python
Python 多线程C段扫描、检测 Ping扫描脚本的实现
2020/09/03 Python
pycharm进入时每次都是insert模式的解决方式
2021/02/05 Python
Tessabit日本:集世界奢侈品和设计师品牌的意大利精品买手店
2020/01/07 全球购物
求职简历自荐信范文
2013/10/21 职场文书
电子商务专业个人的自我评价
2013/11/19 职场文书
电脑租赁公司创业计划书
2014/01/08 职场文书
毕业生自荐信如何写
2014/03/24 职场文书
新品发布会主持词
2014/04/02 职场文书
HR求职自荐信范文
2014/06/21 职场文书
反四风个人对照检查材料
2014/09/26 职场文书
2015年政风行风工作总结
2015/04/21 职场文书
python基础之停用词过滤详解
2021/04/21 Python
win10壁纸在哪个文件夹 win10桌面背景图片文件位置分享
2022/08/05 数码科技
JS前端canvas交互实现拖拽旋转及缩放示例
2022/08/05 Javascript