js浏览器下载jpg, png, txt文件踩坑（尝试了百度的各种方法，以下总结2个靠谱点的）

this指向谁

于 2020-03-18 10:53:47 发布

阅读量1.1k

点赞数

分类专栏： JS常见下载问题文章标签： javascript html

本文链接：https://blog.csdn.net/qq_43258005/article/details/104937114

版权

使用a标签下载jpg，png , txt 格式文件的话，因为浏览器机制的原因，会直接打开文件而不是下载！（如果是相对路径的文件，使用a标签的href则能正常下载）

网络图片jpg,png下载

例如let imgSrc = "https://fastmarket.oss-cn-shenzhen.aliyuncs.com/oss/static/other/1/images/baseMap_index.jpg"图片路径

第一步先将图片转为base64格式

//width、height调用时传入具体像素值，控制大小 ,不传则默认图像大小
function getBase64Image(img, width, height) {
   
    var canvas = document.createElement("canvas");
    canvas.width = width ? width : img.width;
    canvas.height = height ? height : img.height;
    var ctx = canvas.getContext("2d");
    ctx.drawImage(img, 0, 0, canvas.width, canvas.height);
    var dataURL = canvas.toDataURL();
    return dataURL;
}
function getCanvasBase64(img) {
   
   var image = new Image();
    image.crossOrigin = '';
    image.src = img;
    var deferred = $.