// 点击放大图片

            function showimg(t) {

                var src = $(t).attr("src");

                var title = $(t).attr("title");

                if (src === '') {

                    layer.msg("图片为空！");

                    return false;

                }

                layer.open({

                    type: 1,

                    title: false,

                    content: '<img style="display: inline-block; max-width: 100%; max-height: 100%;" src="' + src + '" title="' + title + '" alt="' + title + '">' +

                        '<a  class="layui-btn layui-btn-sm" href="' + src + '" download="' + title + '">下载图片</a>'

                });

            }







            // 点击放大图片

            function showimg1(t) {

                var src = $(t).attr("src");

                var title = $(t).attr("title");

                if (src === '') {

                    layer.msg("图片为空！");

                    return false;

                }

                layer.open({

                    type: 1,

                    title: false,

                    content: '<img style="display: inline-block; max-width: 100%; max-height: 100%;" src="' + src + '" title="' + title + '" alt="' + title + '">' +

                        '<button  class="layui-btn layui-btn-sm" onclick="downloadImage(\'' + src + '\',\'' + title + '\')">下载图片</button>&nbsp;&nbsp;' +

                        '<a  class="layui-btn layui-btn-sm" href="' + src + '" download="' + title + '">备用下载</a>'

                });

            }



            // 从图片URL创建 Blob 对象

            function createBlobFromImageUrl(imageUrl) {

                return fetch(imageUrl)

                    .then(response => response.blob())

                    .catch(error => console.error('Error fetching image:', error));

            }



            // 等待 Blob 创建完成

            async function downloadImage(imageUrl, imageName) {

                if (imageName === undefined) {

                    imageName = "暂无";

                }

                try {

                    const blob = await createBlobFromImageUrl(imageUrl);

                    const blobUrl = URL.createObjectURL(blob);



                    // 创建一个隐藏的 <a> 标签用于下载

                    const link = document.createElement('a');

                    link.href = blobUrl;

                    link.download = imageName + '.jpg'; // 自定义文件名

                    link.style.display = 'none';

                    document.body.appendChild(link);



                    // 触发点击事件进行下载

                    link.click();



                    // 清理临时资源

                    document.body.removeChild(link);

                    URL.revokeObjectURL(blobUrl);

                } catch (error) {

                    console.error('Error creating blob or downloading image:', error);

                }

            }





            //同步方法废弃了

            function downloadImage_old(imageUrl, imageName) {

                if (imageName === undefined) {

                    imageName = "暂无";

                }

                // 使用 Blob URL 创建一个临时链接

                const imageObj = new Image();

                imageObj.onload = function () {

                    // 将图片转换为 Blob 对象

                    const blob = createBlobFromImageUrl(imageUrl);

                    const blobUrl = URL.createObjectURL(blob);



                    // 创建一个隐藏的 <a> 标签用于下载

                    const link = document.createElement('a');

                    link.href = blobUrl;

                    link.download = imageName + '.jpg'; // 自定义文件名

                    link.style.display = 'none';

                    document.body.appendChild(link);



                    // 触发点击事件进行下载

                    link.click();



                    // 清理临时资源

                    document.body.removeChild(link);

                    URL.revokeObjectURL(blobUrl);

                };

                imageObj.src = imageUrl;

            }

上面一共是2中方案，

方案1：

a标签，src是图片的链接地址，然后download属性是文件名，这种方案简单，但是不同的浏览器处理策略不同，不见得100%如此，还有就是和图片链接有关系

/admin.php/plat/create_erweima_url.html?url=http%3A%2F%2Fhua.lizengtong.com%2F%23%2Fdetail1%3Fgoods_id%3D216663  这种没问题

http://tp5-order.oss-cn-beijing.aliyuncs.com/static/upload/LZTPT/images/202406/B70C594B07EF661711A37BFE842A0E7C.jpg  这种下载文件名仍然是B70C594B07EF661711A37BFE842A0E7C.jpg 

优点：如果图片是非当前域名的图片的话，这种方案没有跨域的问题。

方案2：

根据图片的url创建blob对象，然后创建隐藏的a标签，设置href和download属性，然后模拟点击下载，缺点代码需要客户端支持js，一般都是支持的所以这个可以忽略，其次就是的代码相对复杂一些，不过可以通过封装函数实现调用简单。

缺点：如果图片是非当前域名的图片的话，这种方案有跨域的问题。需要图片服务器去掉跨域，如果那边无法去掉，这种方案就是硬伤！