这篇文章主要介绍了解决Ajax加载JSon数据中文乱码问题,需要的朋友可以参考下
一、问题描述
使用zTree的异步刷新父级菜单时,服务器返回中文乱码,但项目中使用了SpringMvc,已经对中文乱码处理,为什么还会出现呢?
此处为的异步请求的配置:
Java代码
async: {
enable: true,
url: basePath + '/sysMenu/listSysMenu',
autoParam: ["id=parentId"]
}
SpringMvc中文字符处理:
Java代码
<mvc:annotation-driven>
<mvc:message-converters>
<bean class="org.springframework.http.converter.StringHttpMessageConverter">
<property name="supportedMediaTypes">
<list>
<value>application/json;charset=UTF-8</value>
<value>text/html;charset=UTF-8</value>
</list>
</property>
</bean>
</mvc:message-converters>
</mvc:annotation-driven>
返回的结果有中文乱码:
Js代码
[
{
"menuId": "880095098165986816",
"menuName": "????",
"parentId": "880095098165986815",
"menuUrl": "http://localhost:8080/imovie-manage/sysMenu/listSysMenuUI",
"menuIcon": "",
"menuSort": 1,
"isEnable": 1,
"parentMenuName": "??",
"id": "880095098165986816",
"name": "????",
"pId": "880095098165986815"
},
{
"menuId": "880095098165986817",
"menuName": "???????",
"parentId": "880095098165986815",
"menuUrl": "http://localhost:8080/imovie-manage/sysMenu/treeSysMenuUI",
"menuIcon": "",
"menuSort": 1,
"isEnable": 1,
"parentMenuName": "??",
"id": "880095098165986817",
"name": "???????",
"pId": "880095098165986815"
}
]
二、解决方案
经过排查,发现是SpringMvc中文字符处理的supportedMediaTypes少了一种类型。
从浏览器发送的请求来看:
异步刷新使用的是post请求,但从服务器返回的时候,Content-Type为:text/plain;charset=ISO-8859-1
charset是ISO-8859-1,而不是UTF-8,而SpringMvc处理的中文乱码没有包含这种类型,所以导致中文乱码。
所以最后的解决方法是在SpringMvc中文处理加上text/plain这个类型,如下:
Java代码
<value>text/plain;charset=UTF-8</value>
具体如下:
Java代码
<property name="supportedMediaTypes">
<list>
<value>application/json;charset=UTF-8</value>
<value>text/html;charset=UTF-8</value>
<value>text/plain;charset=UTF-8</value>
</list>
</property>
总结
以上所述是小编给大家介绍的解决Ajax加载JSon数据中文乱码问题,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对编程学习网网站的支持!
本文标题为:解决Ajax加载JSon数据中文乱码问题


- vue keep-alive 2023-10-08
- ajax实现输入提示效果 2023-02-14
- 基于CORS实现WebApi Ajax 跨域请求解决方法 2023-02-14
- javascript 判断当前浏览器版本并判断ie版本 2023-08-08
- 1 Vue - 简介 2023-10-08
- 关于 html:如何从 css 表中删除边距和填充 2022-09-21
- 深入浅析AjaxFileUpload实现单个文件的 Ajax 文件上传库 2022-12-15
- layui数据表格以及传数据方式 2022-12-13
- jsPlumb+vue创建字段映射关系 2023-10-08
- JS实现左侧菜单工具栏 2022-08-31