小编典典

Axios和Fetch有什么区别?

reactjs

我通过使用fetch调用Web服务,但是我可以在axios的帮助下进行相同的操作。所以现在我很困惑。我应该选择axios还是fetch?


阅读 739

收藏
2020-07-22

共1个答案

小编典典

Fetch和Axios在功能上非常相似,但是为了实现向后兼容,Axios似乎工作得更好(例如,在IE
11中,fetch无法正常工作

另外,如果您使用JSON请求,则以下是我偶然发现的一些区别。

提取JSON发布请求

let url = 'https://someurl.com';
let options = {
            method: 'POST',
            mode: 'cors',
            headers: {
                'Accept': 'application/json',
                'Content-Type': 'application/json;charset=UTF-8'
            },
            body: JSON.stringify({
                property_one: value_one,
                property_two: value_two
            })
        };
let response = await fetch(url, options);
let responseOK = response && response.ok;
if (responseOK) {
    let data = await response.json();
    // do something with data
}

Axios JSON发布请求

let url = 'https://someurl.com';
let options = {
            method: 'POST',
            url: url,
            headers: {
                'Accept': 'application/json',
                'Content-Type': 'application/json;charset=UTF-8'
            },
            data: {
                property_one: value_one,
                property_two: value_two
            }
        };
let response = await axios(options);
let responseOK = response && response.status === 200 && response.statusText === 'OK';
if (responseOK) {
    let data = await response.data;
    // do something with data
}

所以:

  • 提取 主体 = Axios的 数据
  • 必须对提取的主体进行 字符串化 ,Axios的数据包含该 对象
  • 提取在请求对象中 没有URL ,Axios 在请求对象中 具有URL
  • 提取请求功能包括 url作为参数 ,Axios请求功能 不包括url作为参数
  • 取请求是 确定 当响应对象包含 的确定属性 ,Axios公司请求是 确定状态为200状态文本是“OK”
  • 要获取json对象的响应,请执行以下操作:在访 存中 ,对响应对象调用 json()函数 ,在Axios中,获取响应对象的 data属性

希望这可以帮助。

2020-07-22