js、html前端pc端根据url点击下载图片

直接复制进去就好了(变量只有imgsrc和文件名)
当然也有通过通过a标签下载的(有坑,也不适用手机端,另外a标签可以实现base64图片的下载),还是看下方代码吧
js、html前端pc端根据url点击下载图片

uploadPoster(imsrc,name) {
            let imgsrc='https://res.miaocode.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);
            }
        },
上一篇:《Python从入门到实践》--第七章 while循环 课后练习


下一篇:C#:图片加上文字水印(书法印章生成)