获取 post json - Javascript

当我们需要获取POST请求数据中传输的JSON格式数据时，可以使用Javascript的原生方法来获取。本文将介绍获取post json数据的两种方式，一种使用XMLHttpRequest对象，另一种使用jQuery库的ajax方法。

使用XMLHttpRequest对象

XMLHttpRequest对象是用于在后台与服务器交换数据的JavaScript API。我们可以使用XMLHttpRequest对象来获取post请求中传输的json数据。

以下是获取post json数据的示例代码：

var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
    if (xhr.readyState === 4 && xhr.status === 200) {
        var data = JSON.parse(xhr.responseText);
        console.log(data);
    }
};
xhr.open('POST', '/api/endpoint');
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.send(JSON.stringify({key: 'value'}));

• 创建一个XMLHttpRequest对象
• 创建一个onreadystatechange事件，当readyState值为4并且status值为200时，表示请求成功，将返回的JSON数据转换为对象并打印到控制台上。
• 调用open方法，指定请求的方式和请求地址。
• 调用setRequestHeader方法，将请求头设置为"Content-Type": "application/json"，指定请求体的数据格式。
• 发送POST请求，将JSON数据转换为字符串并发送。

使用jQuery的ajax方法

jQuery是一个流行的JavaScript库，可以方便地发起ajax请求。使用jQuery的ajax方法可以更简单地获取post json数据。

以下是使用jQuery获取post json数据的示例代码：

$.ajax({
  type: 'POST',
  url: '/api/endpoint',
  data: JSON.stringify({key: 'value'}),
  contentType: 'application/json',
  success: function(data) {
    console.log(data);
  }
});

• 调用jQuery的ajax方法，指定请求方式，请求地址和请求数据等参数。
• 设置contentType值为'application/json'，指定请求体的数据格式。
• success回调函数会在请求成功时被调用，将返回的JSON数据打印到控制台上。

以上是获取post json数据的两种方式，其中jQuery的ajax方法更为方便快捷。当然，我们也可以使用XMLHttpRequest对象来完成此任务，了解原生JavaScript的API也是非常重要的程序员素养之一。