js, html front-end pc end haga clic para descargar imágenes de acuerdo con la URL

Simplemente copie el código a continuación para usarlo (las variables son solo imgsrc y el nombre del archivo)

Por supuesto, también hay descargas a través de la etiqueta a (hay un pozo, no es aplicable al teléfono móvil, y la etiqueta a puede descargar imágenes base64), así que veamos mi código.
Inserte la descripción de la imagen aquí

Este es mi codigo

uploadPoster(imsrc,name) {
    
    
            let imgsrc='https://res.xxxxx.com/adf442a7-1080-4c01-bf3b-f2cewea5f78b6d.png'
            try{
    
    
                let image = new Image();
                // 解决跨域 Canvas 污染问题
                image.setAttribute("crossOrigin", "anonymous");
                image.onload = function() {
    
    
                    let canvas = document.createElement("canvas");
                    canvas.width = image.width;
                    canvas.height = image.height;
                    let context = canvas.getContext("2d");
                    context.drawImage(image, 0, 0, image.width, image.height);
                    let url = canvas.toDataURL("image/png"); //得到图片的base64编码数据
                    let a = document.createElement("a"); // 生成一个a元素
                    let event = new MouseEvent("click"); // 创建一个单击事件
                    a.download = name || "photo"; // 设置图片名称
                    a.href = url; // 将生成的URL设置为a.href属性
                    a.dispatchEvent(event); // 触发a的单击事件
                };
                image.src = imgsrc;
        
            }catch(e){
    
    
                console.log(e);
            }
        },

Supongo que te gusta

Origin blog.csdn.net/weixin_45629623/article/details/110526520
Recomendado
Clasificación