jQuery Ajax GET/POST 神奇的编码问题

jquery ajax 说明文档:http://www.w3school.com.cn/jquery/ajax_ajax.asp

一、数据AJAX提交PHP进行接收

<?php
if( 
    preg_match("/^([".chr(228)."-".chr(233)."]{1}[".chr(128)."-".chr(191)."]{1}[".chr(128)."-".chr(191)."]{1}){1}/", $_REQUEST['content']) == TRUE || 
    preg_match("/([".chr(228)."-".chr(233)."]{1}[".chr(128)."-".chr(191)."]{1}[".chr(128)."-".chr(191)."]{1}){1}$/", $_REQUEST['content']) == TRUE || 
    preg_match("/([".chr(228)."-".chr(233)."]{1}[".chr(128)."-".chr(191)."]{1}[".chr(128)."-".chr(191)."]{1}){2,}/", $_REQUEST['content']) == TRUE
){
    echo '输入编码为UTF-8,'.$_REQUEST['content'];
}else{
    echo '输入编码为GBK,'.iconv('GBK', 'UTF-8', $_REQUEST['content']);
}

二、ajax提交中文

提交数据的页面编码和接收数据的页面编码一致
抓包工具: Fiddler

1、页面编码:utf-8; 提交方式:GET; data类型:字符串; 未手动进行URL编码

$.ajax({
    type : 'GET',
    url : 'request.php',
    data : 'content=测试内容',
    success : function(data){ alert(data); }
});
测试结果
(1) 火狐、 chrome: 输入编码为UTF-8,测试内容
(2) IE: 输入编码为GBK,测试内容

【抓包分析】
火狐、chrome,对content值进行url编码。
IE 中 content 直接就出现了乱码(编码未知),服务端返回“输入编码为GBK”,猜测转码(GBK->UTF-8)成功。

jQuery Ajax GET/POST 神奇的编码问题_第1张图片
jQuery Ajax GET/POST 神奇的编码问题_第2张图片
jQuery Ajax GET/POST 神奇的编码问题_第3张图片

【问题1】为什么网页编码为utf8的情形下,IE下进行ajax get 提交,传递中文内容编码为GBK?

2、页面编码:utf-8; 提交方式:GET; data类型:字符串; 手动进行URL编码

$.ajax({
    type : 'GET',
    url : 'utf8_request.php',
    data : encodeURI('content=测试内容'),	// 手动进行URL编码
    success : function(data){ alert(data); }
});

【测试结果】
火狐、chrome、IE,都返回“ 输入编码为UTF-8,测试内容
【抓包分析】
火狐、chrome,抓包结果和 1 相同,不再截图。
以下为IE的截图:
jQuery Ajax GET/POST 神奇的编码问题_第4张图片

【问题2】在页面编码为utf8的情况下,手动进行了URL编码,为什么编码结果为UTF8下的URL编码?为什么不是GBK下的编码(未手动URL编码的情况下,中文输入编码为GBK)?

注:
在页面编码为UTF8下,“测试内容”的URL编码为 %E6%B5%8B%E8%AF%95%E5%86%85%E5%AE%B9
在页面编码为GBK下,“测试内容”的URL编码为 %B2%E2%CA%D4%C4%DA%C8%DD

3、页面编码:utf-8; 提交方式:GET; data类型:对象; 未手动进行URL编码

$.ajax({
    type : 'GET',
    url : 'utf8_request.php',
    data : {'content':'测试内容'},
    success : function(data){ alert(data); }
});
【测试结果】
火狐、chrome、IE,都返回“  输入编码为UTF-8,测试内容

【抓包分析】
火狐、chrome、IE,抓包结果一样,不再截图,都自动进行了URL编码。
GET /ajax/utf8_request.php?content=%E6%B5%8B%E8%AF%95%E5%86%85%E5%AE%B9 HTTP/1.1

4、页面编码:utf-8; 提交方式:POST; data类型:字符串


$.ajax({
    type : 'POST',
    url : 'utf8_request.php',
    data : 'content=测试内容',
    success : function(data){ alert(data); }
});
【测试结果】  
火狐、chrome、IE,都返回“    输入编码为UTF-8,测试内容  
【抓包分析】

火狐、chrome、IE,抓包结果一样,不再截图,都自动进行了URL编码。

三、解惑

找到大神说明文档:http://www.jb51.net/web/12714.html

四、总结

1、jquery ajax data 类型,最好还是用对象,不要用字符串,省的IE出现莫名其妙的问题。

2、这个GET中文乱码问题,不单单是ajax提交的问题,而是浏览器自动识别进行URL编码的问题。

你可能感兴趣的:(jquery,Ajax,编码,乱码)