解決Ajax加載JSon數(shù)據(jù)中文亂碼問題

更新時間：2017年10月23日 14:44:27 作者：凡塵煉心

這篇文章主要介紹了解決Ajax加載JSon數(shù)據(jù)中文亂碼問題,需要的朋友可以參考下

一、問題描述

使用zTree的異步刷新父級菜單時，服務(wù)器返回中文亂碼，但項目中使用了SpringMvc，已經(jīng)對中文亂碼處理，為什么還會出現(xiàn)呢？

此處為的異步請求的配置：

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>

返回的結(jié)果有中文亂碼：

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" 
  } 
]

二、解決方案

經(jīng)過排查，發(fā)現(xiàn)是SpringMvc中文字符處理的supportedMediaTypes少了一種類型。

從瀏覽器發(fā)送的請求來看：

異步刷新使用的是post請求，但從服務(wù)器返回的時候，Content-Type為：text/plain;charset=ISO-8859-1

charset是ISO-8859-1，而不是UTF-8，而SpringMvc處理的中文亂碼沒有包含這種類型，所以導(dǎo)致中文亂碼。

所以最后的解決方法是在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>

總結(jié)

以上所述是小編給大家介紹的解決Ajax加載JSon數(shù)據(jù)中文亂碼問題，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！

您可能感興趣的文章:

相關(guān)文章

Ajax 接收服務(wù)器返回的json響應(yīng)方法
今天小編就為大家分享一篇Ajax 接收服務(wù)器返回的json響應(yīng)方法，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
2018-08-08
如何創(chuàng)建ajax對象并兼容多個瀏覽器
這篇文章主要介紹了創(chuàng)建ajax對象并兼容多個瀏覽器方法簡單記錄,在某些情況下還是比較實用的，需要的朋友可以參考下
2014-08-08
Ajax+php數(shù)據(jù)交互并且局部刷新頁面的實現(xiàn)詳解
這篇文章主要給大家介紹了關(guān)于利用Ajax與php數(shù)據(jù)交互并且局部刷新頁面的實現(xiàn)方法，文中通過示例代碼介紹的非常詳細，對大家具有一定的參考學(xué)習(xí)價值，需要的朋友們下面跟著小編一起來學(xué)習(xí)學(xué)習(xí)吧。
2017-07-07
jQuery+Ajax+PHP實現(xiàn)“喜歡”評級功能附源碼下載
有同學(xué)問我如何實現(xiàn)一個像美麗說那樣的“我喜歡”評級功能，當用戶看到自己喜歡的圖片或文章時，點擊“紅心”按鈕，系統(tǒng)會自動記錄用戶的點擊，并將總數(shù)加1。這樣再結(jié)合不同的系統(tǒng)，可以將此功能應(yīng)用到投票或收藏商品中去（如淘寶的收藏商品）。
2015-10-10
基于fileUpload文件上傳帶進度條效果的實例(必看)
下面小編就為大家?guī)硪黄趂ileUpload文件上傳帶進度條效果的實例(必看)。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2017-06-06
IE9 IE8 ajax跨域問題的快速解決方法
下面小編就為大家?guī)硪黄狪E9 IE8 ajax跨域問題的快速解決方法。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2016-07-07
ajax請求后臺接口數(shù)據(jù)與返回值處理js的實例講解
今天小編就為大家分享一篇ajax請求后臺接口數(shù)據(jù)與返回值處理js的實例講解，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
2018-08-08
JS AJAX前臺如何給后臺類的函數(shù)傳遞參數(shù)
這篇文章主要介紹了JS AJAX前臺給后臺類的函數(shù)傳遞參數(shù)的方法，下面有個不錯的示例，需要的朋友可以參考下
2014-06-06
ajax 服務(wù)器文本框自動填值
最近二天。項目做完了。閑著沒事做就自己寫了一點東西。在寫的過程中。發(fā)現(xiàn)利用服務(wù)器的文本框去查找用戶的相關(guān)信息的時刻總要去刷新頁面。
2009-06-06
解決ajax傳過來的值后臺接收不到的問題
今天小編就為大家分享一篇解決ajax傳過來的值后臺接收不到的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
2018-08-08