服务器端的 JSON应用教程_H5之家 - 中国HTML5教程资源分享第一站

将 JSON 发给服务器

将 JSON 发给服务器并不难，但却至关重要，而且还有一些重要的选择要做。但是，一旦决定使用 JSON，所要做的这些选择就会十分简单而且数量有限，所以您需要考虑和关注的事情不多。重要的是能够将 JSON 字符串发送给服务器，而且最好能做到尽快和尽可能简单。

通过 GET 以名称/值对发送 JSON

将 JSON 数据发给服务器的最简单方法是将其转换成文本，然后以名称/值对的值的方式进行发送。请务必注意，JSON 格式的数据是相当长的一个对象，看起来可能会如清单 1 所示：
清单 1. JSON 格式的简单 JavaScript 对象

var people = { "programmers": [ { "firstName": "Brett", "lastName":"McLaughlin",
"email": "brett@newInstance.com" }, { "firstName": "Jason", "lastName":"Hunter",
"email": "jason@servlets.com" }, { "firstName": "Elliotte", "lastName":"Harold",
"email": "elharo@macfaq.com" } ], "authors": [ { "firstName": "Isaac",
"lastName": "Asimov", "genre": "science fiction" }, { "firstName": "Tad",
"lastName": "Williams", "genre": "fantasy" }, { "firstName": "Frank",
"lastName": "Peretti", "genre": "christian fiction" } ], "musicians": [
{ "firstName": "Eric", "lastName": "Clapton", "instrument": "guitar" },
{ "firstName": "Sergei", "lastName": "Rachmaninoff", "instrument": "piano" } ] }

如果要以名称/值对将其发送到服务器端，应该如下所示：

var url = "organizePeople.php?people=" + people.toJSONString();
xmlHttp.open("GET", url, true);
xmlHttp.onreadystatechange = updatePage;
xmlHttp.send(null);

这看起来不错，但却存在一个问题：在 JSON 数据中会有空格和各种字符，Web 浏览器往往要尝试对其继续编译。要确保这些字符不会在服务器上（或者在将数据发送给服务器的过程中）引起混乱，需要在 JavaScript escape() 函数中做如下添加：

var url = "organizePeople.php?people=" + escape(people.toJSONString());
request.open("GET", url, true);
request.onreadystatechange = updatePage;
request.send(null);

该函数可以处理空格、斜线和其他任何可能影响浏览器的内容，并将它们转换成 Web 可用字符（比如，空格会被转换成 %20，浏览器并不会将其视为空格处理，而是不做更改，将其直接传递到服务器）。之后，服务器会（通常自动）再把它们转换回它们传输后的本来 “面目”。

这种做法的缺点有两个：
• 在使用 GET 请求发送大块数据时，对 URL 字符串有长度限制。虽然这个限制很宽泛，但对象的 JSON 字符串表示的长度可能超出您的想象，尤其是在使用极其复杂的对象时更是如此。
• 在跨网络以纯文本发送所有数据的时候，发送数据面临的不安全性超出了您的处理能力。

简言之，以上是 GET 请求的两个限制，而不是简单的两个与 JSON 数据相关的事情。在想要发送用户名和姓之外的更多内容，比如表单中的选择时，二者可能会需要多加注意。若要处理任何机密或极长的内容，可以使用 POST 请求。

利用 POST 请求发送 JSON 数据

当决定使用 POST 请求将 JSON 数据发送给服务器时，并不需要对代码进行大量更改，如下所示：

var url = "organizePeople.php?timeStamp=" + new Date().getTime();
request.open("POST", url, true);
request.onreadystatechange = updatePage;
request.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
request.send(people.toJSONString());

这些代码中的大部分，您都在 “ 掌握 Ajax，第 3 部分：Ajax 中的高级请求和响应” 中见过，应该比较熟悉，第 3 部分重点介绍了如何发送 POST 请求。请求使用 POST 而非 GET 打开，而且 Content-Type 头被设置为让服务器预知它能得到何种数据。在这种情况下，即为 application/x-www-form-urlencoded，它让服务器知道现在发送的是文本，正如它从常规的 HTML 表单中得到的一样。

另一个简单提示是 URL 的末尾追加了时间。这就确保了请求不会在它第一次被发送后即缓存，而是会在此方法每次被调用后重新创建和重发；此 URL 会由于时间戳的不同而稍微有些不同。这种技巧常被用于确保到脚本的 POST 每次都会实际生成新请求且 Web 服务器不会尝试缓存来自服务器的响应。

JSON 就只是文本

不管使用 GET 还是 POST，关键之处在于 JSON 就只是文本。由于不需要特殊编码而且每个服务器端脚本都能处理文本数据，所以可以轻松利用 JSON 并将其应用到服务器。假如 JSON 是二进制格式的或是一些怪异的文本编码，情况就不这么简单了；幸好 JSON 只是常规的文本数据（正如脚本能从表单提交中所接收到的数据，在 POST 段和 Content-Type 头中亦可以看出），所以在将数据发送到服务器时无需太费心。

在服务器上解释 JSON
一旦您编写完客户端 JavaScript 代码、允许用户与 Web 表单和 Web 页的交互、收集发送给服务器端程序以做处理所需的信息，此时，服务器就成为了应用程序（如果调用了异步使用的服务器端程序，则可能是我们认为的所谓的 “Ajax 应用程序”）中的主角。在此时，您在客户端所做的选择（比如使用 JavaScript 对象，然后将其转换成 JSON 字符串）必须要与服务器端的选择相匹配，比如使用哪个 API 解码 JSON 数据。

处理 JSON 的两步骤

不管在服务器端使用何种语言，在服务器端处理 JSON 基本上就需要两个步骤。
1. 针对编写服务器端程序所用的语言，找到相应的 JSON 解析器/工具箱/帮助器 API。
2. 使用 JSON 解析器/工具箱/帮助器 API 取得来自客户机的请求数据并将数据转变成脚本能理解的东西。

以上差不多就是目前所应了解的大致内容了。接下来，我们对每个步骤进行较为详细的介绍。