最近在某个项目的开发过程中碰到了关于HTTP请求中的参数编码问题。由于原本团队的开发的项目中所使用的编码都是GBK(个人觉得这是万恶之源),而团队最近又在开发一个完全独立于原项目的新项目,而在这个项目中又都是使用了UTF-8,于是碰到了一些编码转换上问题。
具体的问题场景:
客户端需要发送异步请求(起初使用GET方式)给后台,请求的参数里面包含了中文字;后台在服务端接受到的参数内容的编码会根据客户端所使用浏览器不同而不同。譬如,我在网页程序中含有异步提交含有中文的字符串的逻辑,当你分别使用IE和Chrome访问该页面,并调用请求时,服务器所接受到的请求中参数的编码不同,我们的项目中,通过IE提交的异步请求在服务器端接收到的参数编码形式为GBK,而通过Chrome提交的异步请求在服务器端接收到的参数编码形式为UTF-8。于是,我从几个方面去定位问得原因:
在异步请求即XHR中添加设置编码的头部信息:
var object = XHR();// XHR()根据具体浏览器返回相应的异步请求对象
object.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded charset=utf-8');
的确,在网上搜索很多异步请求编码相关的问题都能够用这种方法解决,但是在我这次所碰到的问题上,这个方法并不奏效。在添加了设置异步请求编码形式的头之后,服务器所收到的异步请求的参数编码形式依然为GBK。
改变异步请求的方式(由原来的GET变为POST):
当我尝试使用POST方法来提交同样的请求参数,服务器所接收到的异步请求的参数就不再有编码的区别。
到底是什么原因导致我们在使用GET方法发送异步请求时产生了参数编码问题呢:
于是我又一次尝试了GET方法发送异步请求,但在请求发送之前利用JavaScript原生的encodeURI()(http://www.w3schools.com/jsref/jsref_encodeuri.asp)方法对异步请求的URI进行编码,即将链接用UTF-8编码,于是问题同样也被解决了。
于是,我猜想导致这个问题的原因是由于通过头部添加编码控制所能够影响的仅仅是HTTP请求的内容。当HTTP请求的参数是通过POST方式传输时,参数会在HTTP请求的内容中被传输,其编码受到HTTP头部控制,当HTTP请求的参数是通过GET方式传输时,参数会在HTTP请求的URI中被传输,其编码并不受HTTP头部控制而由浏览器全权控制。
下面是本人编写一个例子:
分别在IE和Chrome下打开测试页面,输入中文,提交后数据会通过GET方式传输,当请求返回时Display内会展示异步请求返回的数据。下面是在浏览器下不同情况的结果:
|
设置头部编码 |
未设置头部编码 |
对参数进行与编码 |
未对参数进行与编码 |
IE |
乱码 |
乱码 |
正常 |
乱码 |
Chrome |
正常 |
正常 |
正常 |
正常 |