IE中msSaveBlob仅下载图片上半部分问题求助

看起来你已经精准排查了Blob的正确性（转成Data URL后和原始数据完全一致），那问题大概率出在IE的msSaveBlob方法本身的特殊行为上，我来给你几个针对性的解决思路：

1. 替换msSaveBlob为msSaveOrOpenBlob #

IE的msSaveBlob在处理较大Blob时偶尔会出现截断问题，换成msSaveOrOpenBlob往往能解决这个问题——它和msSaveBlob功能一致，但兼容性和稳定性更优：

downloadButton.onclick = function () { 
  if (window.navigator.msSaveOrOpenBlob) { 
    var filename = "image.png"; 
    var data = $('#qrCode').attr("href"); 
    var blob = dataURLtoBlob(data); 
    // 替换为msSaveOrOpenBlob
    window.navigator.msSaveOrOpenBlob(blob, filename); 
  } 
}

2. 优化dataURLtoBlob的实现 #

虽然你验证过Blob是正确的，但可以试试更适配IE环境的转Blob写法，避免TypedArray的兼容问题：

function dataURLtoBlob(dataUrl) {
  const [metaPart, dataPart] = dataUrl.split(',');
  const mimeMatch = metaPart.match(/:(.*?);/);
  const mime = mimeMatch ? mimeMatch[1] : 'image/png';
  // 兼容URL安全的base64编码（如果你的Data URL是这种格式）
  const decodedData = atob(dataPart.replace(/-/g, '+').replace(/_/g, '/'));
  const buffer = new ArrayBuffer(decodedData.length);
  const view = new Uint8Array(buffer);
  
  for (let i = 0; i < decodedData.length; i++) {
    view[i] = decodedData.charCodeAt(i);
  }
  
  return new Blob([buffer], { type: mime });
}

3. 移除调试用的FileReader代码 #

你的FileReader是用来验证Blob的，但IE的异步操作可能和msSaveBlob产生未知冲突，建议先去掉这部分调试代码，确保保存操作不受干扰：

// 暂时移除这些调试代码
// let reader = new FileReader(); 
// reader.readAsDataURL(blob); 
// reader.onload = function() { 
//   console.log(reader.result); 
// }; 

4. 尝试将Blob转为File对象保存 #

IE的msSaveBlob也支持File对象，把Blob包装成File再保存，可能绕过截断问题：

const file = new File([blob], filename, { type: blob.type });
window.navigator.msSaveOrOpenBlob(file, filename);

额外排查点 #

• 确认Data URL没有被截断：检查console.log(data)输出的长度和原始Data URL是否一致——IE对a标签的href属性有长度限制，过长的Data URL可能被自动截断。
• 确保mime类型和文件名后缀匹配：比如Data URL的mime是image/png，文件名后缀必须是.png，避免IE因类型不匹配出现异常。

内容的提问来源于stack exchange，提问作者chrisurun