原生ajax怎么传递json数据类型

在开发网页应用时，我们经常需要与服务器进行数据交换，而AJAX（Asynchronous JavaScript and XML）是一种在不刷新页面的情况下与服务器交换数据并更新部分网页的技术，在现代Web开发中，JSON（JavaScript Object Notation）成为了数据交换的主流格式，因为它易于阅读和编写，同时也易于机器解析和生成。

原生AJAX允许我们手动创建XMLHttpRequest对象，通过这个对象我们可以发送HTTP请求，并处理来自服务器的响应，当我们需要发送JSON数据时，我们需要设置请求头中的Content-Type为application/json，这样服务器就知道我们发送的是JSON格式的数据。

下面是一个简单的原生AJAX请求示例，展示了如何发送和接收JSON数据：

// 创建一个新的XMLHttpRequest对象
var xhr = new XMLHttpRequest();
// 配置请求的类型（GET或POST），URL以及是否异步
xhr.open('POST', 'your-endpoint-url', true);
// 设置请求头，告诉服务器我们发送的是JSON数据
xhr.setRequestHeader('Content-Type', 'application/json');
// 设置响应类型为JSON，这样浏览器会自动将响应解析为JavaScript对象
xhr.responseType = 'json';
// 定义当请求完成时执行的函数
xhr.onload = function () {
  if (xhr.status >= 200 && xhr.status < 300) {
    // 请求成功，xhr.response将包含解析后的JSON对象
    console.log(xhr.response);
  } else {
    // 请求失败，处理错误
    console.error(xhr.statusText);
  }
};
// 定义当请求出错时执行的函数
xhr.onerror = function () {
  console.error("请求失败");
};
// 准备要发送的JSON数据
var data = JSON.stringify({
  key1: 'value1',
  key2: 'value2'
});
// 发送请求，包括要发送的数据
xhr.send(data);

在这个例子中，我们首先创建了一个XMLHttpRequest对象，然后配置了请求的类型为POST，指定了URL，并设置了请求为异步，我们设置了请求头，告诉服务器我们发送的是JSON数据，我们还设置了响应类型为JSON，这样浏览器会自动将服务器返回的JSON字符串解析为JavaScript对象。

在onload事件处理器中，我们检查了HTTP响应状态码，如果是2xx系列的代码，说明请求成功，我们可以通过xhr.response访问解析后的JSON数据，如果状态码不是2xx系列，说明请求失败，我们可以处理错误。

我们使用JSON.stringify方法将JavaScript对象转换为JSON字符串，并使用xhr.send方法发送请求，包括要发送的数据。

这种方式允许开发者完全控制AJAX请求的每个细节，包括请求头、响应处理等，但也意味着需要编写更多的代码，对于复杂的应用，可能需要考虑使用现代的库或框架，如jQuery的$.ajax方法或者Fetch API，它们提供了更简洁的API和更多的功能，如Promise支持等，不过，了解原生AJAX的工作原理对于理解Web开发是非常有帮助的。