使用ajax jquery时奇怪的“urlencoded”和“multipart/form-data”内容答案

【问题标题】：strange "urlencoded" and "multipart/form-data" content when using ajax jquery使用ajax jquery时奇怪的“urlencoded”和“multipart/form-data”内容
【发布时间】：2015-01-02 22:00:17
【问题描述】：

我有以下 jQuery 脚本：

<script>
$( document ).ready(function() {

var mydata = "öäüöäü";
$.ajax({
    url : "http://localhost:10000",
    type: "POST",
    data : mydata,
    success: function(data, textStatus, jqXHR) {},
    error: function (jqXHR, textStatus, errorThrown) {}
    })
});
</script>

我正在尝试使用 Python 解析请求，如果我运行上面的代码，我在网络上看到的是：

POST / HTTP/1.1\r\n
Host: localhost:10000\r\n
User-Agent: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:34.0) Gecko/20100101 Firefox/34.0\r\n
Accept: */*\r\n
Accept-Language: en-US,en;q=0.5\r\n
Accept-Encoding: gzip, deflate\r\n
Content-Type: application/x-www-form-urlencoded; charset=UTF-8\r\n
Referer: http://localhost/index_ajax.html\r\n
Content-Length: 12\r\n
Origin: http://localhost\r\n
Connection: keep-alive\r\n
Pragma: no-cache\r\n
Cache-Control: no-cache\r\n
\r\n
\xc3\xb6\xc3\xa4\xc3\xbc\xc3\xb6\xc3\xa4\xc3\xbc

Content-Type 是“x-www-form-urlencoded”，但所有数据似乎都是字节编码的而不是为此内容类型定义的百分比编码。

从以下位置更改 ajax 代码：

data : mydata,

到

{'mydata': data}

产生相同的标题和正确的正文内容：

mydata=%C3%B6%C3%A4%C3%BC%C3%B6%C3%A4%C3%BC

内容现在按预期百分比编码。

如果我向 ajax 代码添加另一个内容类型，则会产生相同的正文：

contentType:"multipart/form-data"

现在我在标题中看到“Content-Type: multipart/form-data; charset=UTF-8”，但正文本身不只是 multipart/form-data 的预期。

为什么 jQuery 允许向服务器发送不符合要求的数据？如何向服务器发送正确的数据？

【问题讨论】：

标签： javascript jquery python ajax forms

【解决方案1】：

您看到的 Content-Type 标头是要发送的默认标头。当您将data 设置为字符串 时，jQuery 假定您已经自己处理了编码，以便进行任何转换（例如，表单 URL 编码）您拥有发送一个对象。

见jQuery.ajax() documentation：

contentType（默认：'application/x-www-form-urlencoded; charset=UTF-8'）

和

数据
类型：PlainObject 或 String 或 Array
要发送到服务器的数据。 如果还不是字符串，则将其转换为查询字符串。

强调我的。

如果 jQuery 转换了字符串，您将永远无法发送应该不进行 URL 编码的有效内容类型，例如 JSON 或 XML 帖子正文，也无法发布已经存在的数据通过其他方式对 URL 进行编码。

要自己手动编码数据，请使用encodeURIComponent() function：

$.ajax({
    url : "http://localhost:10000",
    type: "POST",
    data : encodeURIComponent(mydata),
    success: function(data, textStatus, jqXHR) {},
    error: function (jqXHR, textStatus, errorThrown) {}
    })
});

【讨论】：