H5保存图片到相册

savePic:为打开图片链接，需要长按保存等，可直接用微信打开

savePic(Url) {
    var triggerEvent = "touchstart"; //指定下载方式
    var blob = new Blob([''], { type: 'application/octet-stream' }); //二进制大型对象blob
    var url = URL.createObjectURL(blob); //创建一个字符串路径空位
    var a = document.createElement('a'); //创建一个 a 标签
    a.href = Url;  //把路径赋到a标签的href上
    a.download = Url.replace(/(.*\/)*([^.]+.*)/ig, "$2").split("?")[0];
    var e = new MouseEvent('click', (true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null));
    a.dispatchEvent(e);
    URL.revokeObjectURL(url);
},

downLoad需要跳转到浏览器打开保存

downLoad(src) {
    var filename; //图片名称
    var filetype; //图片类型
    var path = src
    if (path.indexOf("/") > 0) {
        var file = path.substring(path.lastIndexOf("/") + 1, path.length);
        var fileArr = file.toLowerCase().split(".");
        filename = fileArr[0];
        filetype = fileArr[1];
    }
    let image = new Image();
    image.setAttribute("crossOrigin", "anonymous");
    image.crossOrigin = '*';  // 解决跨域
    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 img = canvas.toDataURL(`image/${filetype}`); //得到图片的base64编码数据
        let a = document.createElement("a"); // 生成一个a元素
        let event = new MouseEvent("click"); // 创建一个单击事件
        a.download = filename; // 设置图片名称，-------------你传递的图片名称
        a.href = img  // 将生成的URL设置为a.href属性
        a.dispatchEvent(event); // 触发a的单击事件
    };
    image.src = path + '?v=' + Math.random();// 防止缓存
},