JS — fetch封装

function request(url, options = {}) {
  const defaultOptions = {
    method: 'GET',
    headers: {
      'Content-Type': 'application/json',
    },
    body: null,
  };

  const requestOptions = { ...defaultOptions, ...options };

  return fetch(url, requestOptions)
    .then(response => {
      const contentType = response.headers.get('content-type');
      if (!response.ok) {
        throw new Error(`请求失败: ${response.status}`);
      } else if (contentType && contentType.includes('application/json')) {
        return response.json();
      } else {
        return response.text();
      }
    })
    .catch(error => {
      console.error('请求失败:', error);
      throw error;
    });
}

// 使用示例
const apiUrl = 'https://jsonplaceholder.typicode.com/posts';

// 发起GET请求
request(apiUrl)
  .then(data => {
    console.log('GET请求成功:', data);
  })
  .catch(error => {
    console.error('GET请求失败:', error);
  });

// 发起POST请求
const postData = {
  title: 'foo',
  body: 'bar',
  userId: 1,
};
const postOptions = {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json',
  },
  body: JSON.stringify(postData),
};
request(apiUrl, postOptions)
  .then(data => {
    console.log('POST请求成功:', data);
  })
  .catch(error => {
    console.error('POST请求失败:', error);
  });

//将默认的请求选项定义为一个对象,并且在用户提供的选项和默认选项之间进行合并。
//根据响应的内容类型来决定是解析为JSON格式还是纯文本格式。

 

posted on 2024-05-14 09:16  萬事順意  阅读(46)  评论(0编辑  收藏  举报