多种方式将图片下载到本地

1. 方法一：使用<a>标签的download属性，指定下载文件的名称和链接。

例如：

<a href="https://example.com/image.jpg" download="image.jpg">下载图片</a>

2. 方法二：使用JavaScript创建一个<a>标签，并设置download属性和href属性为图片的本地地址，然后触发点击事件。

例如：

function downloadImage(url) {
  var a = document.createElement("a");
  a.download = url.split("/").pop();
  a.href = url;
  document.body.appendChild(a);
  a.click();
  document.body.removeChild(a);
}

3. 方法三：使用JavaScript发送一个请求，获取图片的二进制数据或base64数据，然后创建一个Blob对象，用URL.createObjectURL()方法生成一个本地地址，再用方法二中的方式下载。

例如：

function downloadImage(url) {
  var xhr = new XMLHttpRequest();
  xhr.open("GET", url, true);
  xhr.responseType = "blob";
  xhr.onload = function() {
    if (this.status == 200) {
      var blob = this.response;
      var a = document.createElement("a");
      a.download = url.split("/").pop();
      a.href = URL.createObjectURL(blob);
      document.body.appendChild(a);
      a.click();
      document.body.removeChild(a);
    }
  };
  xhr.send();
}

4. 方法四：使用fetch()方法发送一个GET请求，获取图片的Blob对象，然后用URL.createObjectURL()方法生成一个本地地址，再用<a>标签的download属性和href属性下载。

例如：

function downloadImage(url) {
  fetch(url)
    .then(response => response.blob())
    .then(blob => {
      var a = document.createElement("a");
      a.download = url.split("/").pop();
      a.href = URL.createObjectURL(blob);
      document.body.appendChild(a);
      a.click();
      document.body.removeChild(a);
    });
}

5. 方法五：使用fetch()方法发送一个POST请求，获取图片的Blob对象，然后用FileReader对象读取为base64数据，再用<a>标签的download属性和href属性下载。

例如：

function downloadImage(url) {
  fetch(url, {method: "POST"})
    .then(response => response.blob())
    .then(blob => {
      var reader = new FileReader();
      reader.onload = function() {
        var a = document.createElement("a");
        a.download = url.split("/").pop();
        a.href = this.result;
        document.body.appendChild(a);
        a.click();
        document.body.removeChild(a);
      };
      reader.readAsDataURL(blob);
    });
}