Resuelva el problema entre dominios de descargar archivos en el servicio utilizando el atributo de descarga de la etiqueta H5 a

La forma más sencilla:

 <a href='url' download=filename.ext>Descargar archivo</a>

Si la URL apunta al mismo recurso fuente, es normal.

Si la URL apunta a un recurso de terceros, la descarga fallará y el comportamiento será el mismo que cuando no se utiliza la descarga: los archivos que el navegador puede abrir se abrirán directamente en el navegador y los archivos que no se pueden abrir. que se abra se descargará directamente. Los archivos abiertos por el navegador se pueden descargar manualmente.

Solución 1: empaquete el archivo en un archivo .zip/.rar que el navegador no pueda abrir y descárguelo.

Solución 2: a través del reenvío de back-end, el back-end solicita recursos de terceros y los devuelve al front-end. El front-end utiliza herramientas como el protector de archivos para guardar el archivo.

Si el recurso de terceros al que apunta la URL está configurado con CORS, el atributo de descarga no es válido, pero el archivo se puede obtener y descargar localmente y el nombre del archivo no se puede modificar.

 const downloadRes = async (url, nombre) => { let respuesta = await fetch(url) // Convierte el contenido en una dirección de blob let blob = await respuesta.blob() // Crea un enlace descargable oculto let objectUrl = window. URL .createObjectURL(blob) let a = document.createElement('a') //Dirección a.href = objectUrl //Modificar nombre de archivo a.download = nombre // Activar clic document.body.appendChild(a) a.click() //Eliminar setTimeout(() => document.body.removeChild(a), 1000)}

Si queremos descargar una imagen, podemos convertirla al formato base64 y luego descargarla.

 ```exportar const downloadImg = async (url, nombre) => { var canvas = document.createElement('canvas'), ctx = canvas.getContext('2d'), img = new Image(); 'Anónimo'; img.onload = función() { lienzo.altura = img.altura lienzo.ancho = img.ancho; ctx.drawImage(img, 0, 0); var dataURL = canvas.toDataURL('image/png'); let a = document.createElement('a'); a.href = dataURL; .body.appendChild(a); a.click(); setTimeout(() => { document.body.removeChild(a); lienzo = nulo; }, 1000); }; img.src = URL;};```

Lo anterior es el contenido completo de este artículo. Espero que sea útil para el estudio de todos. También espero que todos apoyen VeVb Wulin Network.