请求协助：将Fetch图片Blob处理代码转换为Axios实现

原代码通过Fetch请求图片并转换为可展示的DataURL，以下是等价的Axios实现：

const image = (url) =>
  axios.get(url, { responseType: 'blob' })
    .then(response => response.data)
    .then(blob => 
      new Promise((resolve, reject) => {
        const reader = new FileReader();
        reader.onloadend = () => resolve(reader.result);
        reader.onerror = reject;
        reader.readAsDataURL(blob);
      })
    );

核心要点说明： #

• Axios需显式配置responseType: 'blob'，这会让响应直接返回Blob对象，对应原Fetch代码中response.blob()的作用
• 后续通过FileReader将Blob转为DataURL的逻辑和原代码完全一致，保证功能等价

如果偏好更直观的async/await写法，也可以用这个版本：

const image = async (url) => {
  const response = await axios.get(url, { responseType: 'blob' });
  const blob = response.data;
  return new Promise((resolve, reject) => {
    const reader = new FileReader();
    reader.onloadend = () => resolve(reader.result);
    reader.onerror = reject;
    reader.readAsDataURL(blob);
  });
};

注意事项： #

• 确保项目已安装并引入Axios（可通过npm install axios安装，或直接通过CDN引入）
• 错误处理可沿用原代码的.catch()链式捕获，或在async/await版本中用try/catch包裹

内容的提问来源于stack exchange，提问作者Diego Chaves