$.ajax的contentType设置及对应后端数据获取方式

在使用 jQuery 的 $.ajax 方法进行 HTTP 请求时，contentType 参数用于指定发送到服务器的数据的编码类型。常见的 contentType 设置包括 'application/json' 和 'application/x-www-form-urlencoded; charset=UTF-8'。以下是对这两种 contentType 的详细对比和说明：

1. contentType: 'application/json'

用途：
• 用于发送 JSON 格式的数据。

特点：
• 数据格式：发送的数据是纯 JSON 字符串。
• HTTP 头部：Content-Type 被设置为 'application/json'，告知服务器请求体的格式为 JSON。
• 适用场景：适用于需要传输复杂数据结构（如嵌套对象、数组等）的场景，通常与 RESTful API 一起使用。

示例代码：

```javascript
 $.ajax({
                url: '/login',
                type: 'POST',
                data: JSON.stringify({
                	username:"Lily",
                	password:"123456"}),
                contentType: 'application/json',
                dataType: 'json',
                success: ...
          })

服务器端处理：
• 服务器需要能够解析 JSON 格式的数据。例如，在servlet 中使用 fastjson进行解析：

@WebServlet("/login")
public class LoginServlet extends HttpServlet {
    @Override
    protected void doPost(HttpServletRequest request, HttpServletResponse response)
            throws ServletException, IOException {
        // 设置响应内容类型
        response.setContentType("application/json");
        response.setCharacterEncoding("UTF-8");

        // 读取请求体中的JSON数据
        StringBuilder sb = new StringBuilder();
        try (BufferedReader reader = request.getReader()) {
            String line;
            while ((line = reader.readLine()) != null) {
                sb.append(line);
            }
        }
        // 使用Fastjson解析JSON数据
        LoginRequest loginRequest = JSON.parseObject(sb.toString(), LoginRequest.class);//LoginRequest类符合javabean要求，包含字段分别为username和password
        // 或者，如果不确定JSON结构，可以使用JSONObject
        // JSONObject jsonObject = JSON.parseObject(sb.toString());
        // String username = jsonObject.getString("username");
        // String password = jsonObject.getString("password");

        // 获取用户名和密码
        String username = loginRequest.getUsername();
        String password = loginRequest.getPassword();

2. contentType: 'application/x-www-form-urlencoded; charset=UTF-8'

用途：
• 用于发送 URL 编码的表单数据。

特点：
• 数据格式：发送的数据是 URL 编码的字符串，类似于 key1=value1&key2=value2。
• 默认发送方式：contentType不设置时，默认为此方式。
• HTTP 头部：Content-Type 被设置为 'application/x-www-form-urlencoded; charset=UTF-8'，告知服务器请求体的格式为 URL 编码的表单数据。
• 适用场景：适用于简单的键值对数据传输，尤其是与传统的 HTML 表单提交兼容的场景。

示例代码：

$.ajax({
                url: '/login',
                type: 'POST',
                data: {
                	username:"Lily",
                	password:"123456"},
                contentType: 'application/x-www-form-urlencoded; charset=UTF-8',
                dataType: 'json',
                success:...
                })

服务器端处理：
• 服务器需要能够解析 URL 编码的数据。例如，在 servlet中使用 request.getParameter直接获取：

@WebServlet("/login")
public class LoginServlet extends HttpServlet {
    private static final long serialVersionUID = 1L;
    private UserService userService = new UserService();
    public LoginServlet() {
    }

    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        // 设置请求和响应的字符编码为UTF-8
        request.setCharacterEncoding("UTF-8");
        response.setContentType("text/html;charset=UTF-8");
        String username = request.getParameter("username");
        String password = request.getParameter("password");
        ...
        }

对比总结

选择建议

• 使用 application/json：
• 当需要传输复杂的数据结构（如嵌套对象、数组）时。
• 当与 RESTful API 通信，且 API 期望接收 JSON 格式的数据时。

• 使用 application/x-www-form-urlencoded; charset=UTF-8：
• 当传输简单的键值对数据时。
• 当需要与传统的 HTML 表单提交保持兼容时。

注意事项

1. 数据序列化：
   • 使用 application/json 时，需要手动将 JavaScript 对象序列化为 JSON 字符串，如 JSON.stringify(data)。
   • 使用 application/x-www-form-urlencoded; charset=UTF-8 时，jQuery 会自动处理数据的 URL 编码。

2. 服务器端解析：
   • 确保服务器端能够正确解析所发送的数据格式。例如，使用适当的中间件或库来处理 JSON 或 URL 编码的数据。

3. 跨域请求（CORS）：
   • 如果涉及跨域请求，确保服务器设置了正确的 CORS 头部，以允许特定的 Content-Type。

通过理解这两种 contentType 的区别和适用场景，可以根据具体需求选择最合适的选项，以实现高效和可靠的数据传输。