ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

js Fetch返回数据res.json()报错问题

2022-08-02 18:31:31  阅读:188  来源: 互联网

标签:body return res JSON js json 报错


前言

一直以来在简单的场景中经常使用fetch代替第三方请求库, fetch是JavaScript的原生函数, 简单、高效、快速、稳定、可定制等等诸多优点。一直也是用着很是舒服,直到有一天它竟然报错了。

什么是Fetch?

官方: Fetch API 提供了一个 JavaScript 接口,用于访问和操纵 HTTP 管道的一些具体部分,例如请求和响应。它还提供了一个全局 fetch() 方法,该方法提供了一种简单,合理的方式来跨网络异步获取资源。

还原现场

因为业务需求简单,这里只封装了get和post方法, 并且后端数据都是已默认的json格式返回

const http = {
  apiBaseUrl: config.apiBaseUrl,
  get: function (url) {
    return new Promise((resolve, reject) => {
      fetch(this.apiBaseUrl + url, {
        method: 'GET',
        headers: {
          'Content-Type': 'application/json',
          'Accept': 'application/json',
        }
      }).then(res => res.json()).then(res => {
        resolve(res);
      }).catch(e => {
        console.error("请求失败了,详细信息:" + JSON.stringify(e));
        reject(e);
      });
    })
  },
  post: function (url, body) {
    return new Promise((resolve, reject) => {
      fetch(this.apiBaseUrl + url, {
        method: "POST",
        headers: {
          'Content-Type': 'application/json',
          'Accept': 'application/json',
        }, body: JSON.stringify(body)
      }).then(res => res.json()).then(res => {
        resolve(res);
      }).catch(e => {
        console.error("请求失败了,详细信息:" + JSON.stringify(e));
        reject(e);
      })
    })
  }
}

这样的封装貌似也没什么问题

标签:body,return,res,JSON,js,json,报错
来源: https://www.cnblogs.com/cnwwm/p/16544797.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有