如何从网页本地保存图像

// 获取图像
var image = document.getElementById('image');

// 创建一个隐藏的Canvas元素
var canvas = document.createElement('canvas');
var context = canvas.getContext('2d');

// 将图像绘制到Canvas上
context.drawImage(image, 0, 0);

// 获取图像数据
var imageData = canvas.toDataURL();

// 创建一个新的本地文件对象
var file = new File([dataURItoBlob(imageData)], 'image.png');

// 将图像数据保存到本地文件
var reader = new FileReader();
reader.onloadend = function() {
  var fileData = new Uint8Array(reader.result);
  
  var writer = new FileWriter();
  writer.write(fileData, file);
};
reader.readAsArrayBuffer(file);

// 将Data URI转换为Blob对象
function dataURItoBlob(dataURI) {
  var byteString = atob(dataURI.split(',')[1]);
  var mimeString = dataURI.split(',')[0].split(':')[1].split(';')[0];
  var ab = new ArrayBuffer(byteString.length);
  var ia = new Uint8Array(ab);
  for (var i = 0; i < byteString.length; i++) {
    ia[i] = byteString.charCodeAt(i);
  }
  return new Blob([ab], { type: mimeString });
}