Ajax-服务器响应的数据格式

服务器端响应的数据格式

在真实的项目中，服务器端大多数情况下会以 JSON 对象作为响应数据的格式。当客户端拿到响应数据时，要将 JSON 数据和 HTML 字符串进行拼接，然后将拼接的结果展示在页面中。
在 http 请求与响应的过程中，无论是请求参数还是响应内容，如果是对象类型，最终都会被转换为对象字符串进行传输。

 JSON.parse() // 将 json 字符串转换为json对象

处理服务器端返回的JSON数据

app.js

 app.get('/responseData',(req,res) => {
  //send可以接收字符串或者json格式的对象数据
  res.send({"name":"zs"})
})

html

//1.创建ajax对象
    var xhr = new XMLHttpRequest()
    //2.告诉ajax对象要向哪里发送请求，以什么方式发送请求
    //请求方式，请求地址
    xhr.open('get','http://localhost:3000/responseData')
    //3.发送请求
    xhr.send();
    //4.responseText是获取服务器端响应到客户端的数据
    xhr.onload = () => {
      // console.log(xhr.responseText);
      // console.log(JSON.parse(xhr.responseText));//转之前是字符串的形式 转之后是json对象
      // 当客户端拿到响应数据时，要将 JSON 数据和 HTML 字符串进行拼接，然后将拼接的结果展示在页面中
      var resText = JSON.parse(xhr.responseText)  //转为对象
      var str = '<h2>' + resText.name + '<h2/>';
      document.body.innerHTML = str  //在页面中展示   
    }