js中fetch封装

在JavaScript中，可以使用fetch函数来进行网络请求。为了更好地封装fetch，可以创建一个自定义的函数来处理常见的请求和响应的逻辑。

以下是一个简单的fetch封装示例：

function request(url, method, body) {
  const options = {
    method: method,
    headers: {
      'Content-Type': 'application/json',
    },
    body: JSON.stringify(body),
  };

  return fetch(url, options)
    .then(response => {
      if (!response.ok) {
        throw new Error('Network response was not ok');
      }
      return response.json();
    })
    .catch(error => {
      console.error('Error:', error);
    });
}

使用这个封装后的fetch函数，你可以通过以下方式发送GET、POST等请求：

// 发送GET请求
request('https://api.example.com/data', 'GET')
  .then(data => {
    console.log('Response:', data);
  });

// 发送POST请求
const body = { username: 'john', password: 'secret' };
request('https://api.example.com/login', 'POST', body)
  .then(data => {
    console.log('Response:', data);
  });

在封装的函数中，我们设置了一些默认的请求头（Content-Type: application/json），并将请求体转换为JSON字符串。然后，使用fetch函数发送网络请求，并处理响应结果。如果响应不成功，会抛出一个错误。你可以根据自己的需求进行适当的修改和扩展。