背景

使用 fetch 下载图片，出现跨域问题, 如下图。查看错误信息，需要设置mode为 no-cors

下载流文件详细内容

export const downloadFile = (filePath, fileName) => {fetch(filePath, {method: 'GET',mode: 'no-cors',}).then(res => res.blob()).then(blob => {const a = document.createElement('a');document.body.appendChild(a);a.style.display = 'none';// 使用获取到的blob对象创建的urlconst url = window.URL.createObjectURL(blob);a.href = url;// 指定下载的文件名a.download = fileName;a.click();document.body.removeChild(a);// 移除blob对象的urlwindow.URL.revokeObjectURL(url);}).catch(err => {console.log(err)})};

fetch发送请求：Failed to fetch相关推荐

【AJAX 笔记】AJAX 基本、HTTP 基本、原生 AJAX 的使用，jQuery / Axios / fetch 发送请求、跨域（JSONP/CORS）
文章目录 1 Ajax 概述 1.1 AJAX 简介 1.2 XML 简介 1.3 AJAX 的特点 1.3.1 AJAX 的优点 1.3.2 AJAX 的缺点 1.4 AJAX 属性和方法 2. H ...
React路由---react-router-dom、获取路由参数、ant design ui组件、fetch发送请求（默认不能跨域）、Switch...
1.下载 yarn add react-router-dom --save 2.导入 import React from "react"; import { BrowserRout ...
Fetch发送网络请求
1. 文档 https://github.github.io/fetch/ https://segmentfault.com/a/1190000003810652 2. 特点 fetch: 原生函数, ...
Fetch -- http请求的另一种姿势
传统Ajax是利用XMLHttpRequest(XHR)发送请求获取数据,不注重分离的原则.而Fetch API是基于Promise设计,专为解决XHR问题而出现. 原文链接简介 XMLHttpRe ...
AJAX(GET POST请求、 jQuery axios 发送请求、跨域--cors、请求超时、网络异常、放弃请求、重复发送请求)
根据视频进行整理 [https://www.bilibili.com/video/BV1WC4y1b78y?p=1] 视频资料百度网盘: 链接:[https://pan.baidu.com/s/1n ...
fetch 发送 AJAX请求
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8" ...
Ajax请求，JQuery发送请求，Axios请求，Fetch请求总结
常见的请求方式 1.Ajax请求定义: 同步与异步的区别: Ajax的工作原理: 实现AJAX的基本步骤: Get请求: Post请求: 2.JQuery发送请求 Get请求: Post请求: 3. ...
http协议修改js或html,web前端面试题对答篇：HTTP fetch发送2次请求的原因？
web前端面试题对答篇:HTTP fetch发送2次请求的原因? 2020-08-31 04:36:44 289 编程开发 HTTP fetch发送2次请求的原因?面对这道出现频率较高的面试题,我想说 ...
winform接收http请求_web前端面试题对答篇：HTTP fetch发送2次请求的原因？
HTTP fetch发送2次请求的原因?面对这道出现频率较高的面试题,我想说的是:发送两次请求的情况确实存在,但这与你所使用的是不是http协议,所采用的是不是fetch真的没有一毛钱关系! 接下来, ...

fetch发送请求：Failed to fetch

背景

fetch发送请求：Failed to fetch相关推荐

最新文章

热门文章