• Fetch API是新的ajax解决方案 Fetch会返回Promise
  • fetch不是ajax的进一步封装,而是原生js,没有使用XMLHttpRequest对象。-
  • fetch(url, options).then()
<script type="text/javascript">
    // Fetch API 基本用法 fetch(url).then() 第一个参数请求的路径
    // Fetch会返回Promise 所以我们可以使用then 拿到请求成功的结果
    fetch('http://localhost:3000/fdata').then(function(data){
        // text()方法属于fetchAPI的一部分,它返回一个Promise实例对象,
        // 用于获取后台返回的数据 return data.text();
        return data.text();
    }).then(function (data) {
        // 在这个then里面我们能拿到最终的数据
        console.log(data);
    })
</script>

一、fetch API 中的 HTTP 请求

  • fetch(url, options).then()
  • HTTP协议,它给我们提供了很多的方法,如POST,GET,DELETE,UPDATE,PATCH和PUT
  • 默认的是 GET 请求
  • 需要在 options 对象中 指定对应的 method method:请求使用的方法
  • post 和 普通 请求的时候 需要在options 中 设置 请求头 headers 和 body

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

二、fetchAPI 中 响应格式

用fetch来获取数据,如果响应正常返回,我们首先看到的是一个response对象,其中包括返回的一堆原始字节,这些字节需要在收到后,需要我们通过调用方法将其转换为相应格式的数据,比如 JSON , BLOB 或者TEXT 等等。

在这里插入图片描述

Logo

前往低代码交流专区

更多推荐