fetch的使用

最近的工作过程中,在做js调取接口的时候,使用了fetch,原来是只知道fetch,但是没有怎么使用过。正好最近使用到,所以对其详细了解了下。

fetch的基本方式

fetch(url,{
    method:'GET', # 'POST','PUT','DELETE'
    headers:{
        'Content-Type':'application/json', //'application/x-www-form-urlencoded'
        'Accept':'application/json'
    },
    body:JSON.stringfiy(body)
}).then((res)=>{
    
    return res.json() //返回一个Promise,解析成JSON,具体请看下面返回的数据
}).then(function(res){
    console.log(res) //获取json数据
}).catch(function(error){
    console.log(error)  //请求错误时返回
})

返回的数据

res.arrayBuffer()
读取 res对象并且将它设置为已读(因为Responses对象被设置为了 stream 的方式,所以它们只能被读取一次) ,并返回一个被解析为ArrayBuffer格式的promise对象

res.blob()
读取 res对象并且将它设置为已读(因为Responses对象被设置为了 stream 的方式,所以它们只能被读取一次) ,并返回一个被解析为Blob格式的promise对象

res.formData()
读取res对象并且将它设置为已读(因为Responses对象被设置为了 stream 的方式,所以它们只能被读取一次) ,并返回一个被解析为FormData格式的promise对象

res.json()
读取 res对象并且将它设置为已读(因为Responses对象被设置为了 stream 的方式,所以它们只能被读取一次) ,并返回一个被解析为JSON格式的promise对象

res.text()
读取 res对象并且将它设置为已读(因为Responses对象被设置为了 stream 的方式,所以它们只能被读取一次) ,并返回一个被解析为USVString格式的promise对象

强制带Cookie

默认情况下, fetch不会从服务端发送或接收任何 cookies, 如果站点依赖于维护一个用户会话,则导致未经认证的请求(要发送 cookies,必须发送凭据头).

fetch(url, {
    method: 'GET',
    credentials: 'include' // 强制加入凭据头
  })
  .then((res)=>{
    return res.text()
  })
  .then((res)=>{
    console.log(res)
  })
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 原文链接:https://www.cnblogs.com/libin-1/p/6853677.html 无论用Ja...
    九毛Evaline阅读 12,989评论 0 7
  • 现在应该很少有人用原生的JS内置XMLHttpRequest对象写异步调用了,仍然用的比较多的应该是Jquery的...
    琉璃橙子阅读 5,888评论 0 2
  • fetch是js提供进行网络请求的框架。 调用结构是这样的。 fetch( url , options ).the...
    lzh_coder阅读 3,440评论 0 0
  • fetch已经被大部分的浏览器兼容了,包括chrome,Firefox,safari,opera,edge,但是I...
    风吹过的空气阅读 4,500评论 0 0
  • 都说林子大了,什么鸟都有, 哦不,什么能人都有, 今天这位丸子,可以说是夹娃娃界的传奇,拥有令店主畏惧的力量, 只...
    丸子地球阅读 9,007评论 0 5

友情链接更多精彩内容