美文网首页
fetch的使用

fetch的使用

作者: 小小看护 | 来源:发表于2018-08-23 13:40 被阅读11次

最近的工作过程中,在做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)
  })

相关文章

  • Fetch

    Fetch API使用 Fetch

  • JS--Fetch API

    fetch() 使用 Fetch Headers() 方法:append() delete() entries()...

  • fetch记录一下子

    1.原生http请求 2.fetch请求 3.上面是封装多得fetch,直接使用的fetch fetch请求对某些...

  • 聊聊fetch

    聊聊fetch fetch的使用 fetch是一个发起异步请求的新api, 在浏览器(有些不支持)中可以直接使用。...

  • 在React-Native中,使用fetch时,cookie问题

    在React-Native中,使用fetch时,cookie问题。 最近在使用fetch时,由于后端返回的请求头里...

  • Fetch的使用

    无业在家,就把一些知识总结下~~今天来总结一下fetch的使用。一些fetch的概念大家可以自己百度下。 fetc...

  • fetch的使用

    最近的工作过程中,在做js调取接口的时候,使用了fetch,原来是只知道fetch,但是没有怎么使用过。正好最近使...

  • fetch 的使用

    现在应该很少有人用原生的JS内置XMLHttpRequest对象写异步调用了,仍然用的比较多的应该是Jquery的...

  • fetch的使用

    fetch是js提供进行网络请求的框架。 调用结构是这样的。 fetch( url , options ).the...

  • Fetch的使用

    原文链接:https://www.cnblogs.com/libin-1/p/6853677.html 无论用Ja...

网友评论

      本文标题:fetch的使用

      本文链接:https://www.haomeiwen.com/subject/obgpiftx.html