Js创建文件并下载

核心技术

• URL.createObjectURL()
• new File()
• new Blob()
• 生成a标签使用href触发下载

一、File创建

格式: new File(textArray, fileName, mimeType)

var file = new File(['Hello', '\n World'], 'hello-world.txt', {type: 'text/plain'})

二、Blob创建

格式: new Blob(textArray, )

var blob = new Blob(['jyjin',  ' can always shock me!'])

三、Blob创建文件并下载

downloadFile(fileName, content)

function downloadFile(fileName, content) {
  // 定义触发事件的DOM
  var aLink = document.createElement('a');
  // 定义BLOB对象，声明文件内容
  var blob = new Blob([content, 'jyjin']);
  // 判定平台
  var isMac = navigator.userAgent.indexOf('Mac OS') > -1;
  // 定义事件对象 
  var evt = document.createEvent(isMac ? "MouseEvents" : "HTMLEvents");
  // 初始化事件
  // evt.initEvent("click", false, false);
  evt[isMac ? "initMouseEvent" : "initEvent"]("click", false, false);
  // 定义下载文件名称
  aLink.download = fileName;
  // 根据上面定义的 BLOB 对象创建文件 dataURL
  aLink.href = URL.createObjectURL(blob);
  // 触发事件下载
  aLink.dispatchEvent(evt);
}

四、File创建文件并下载

downloadFile(fileName, content)

function downloadFile(fileName, content) {
  // 定义触发事件的DOM
  var aLink = document.createElement('a');
  var date = new Date().getFullYear() + '.' + (new Date().getMonth() + 1) + '.' + new Date().getDate();
  // 创建文件
  var file = new File([
  		content, 
  		'\n\n\n【为了演示是数组，加个时间 】\n create at ' + date
  	 ], 
  	 'test.txt', 
  	 { type: 'text/plain' }
  );
  // 判定平台
  var isMac = navigator.userAgent.indexOf('Mac OS') > -1;
  // 定义事件对象 
  var evt = document.createEvent(isMac ? "MouseEvents" : "HTMLEvents");
  // 初始化事件
  // evt.initEvent("click", false, false);
  evt[isMac ? "initMouseEvent" : "initEvent"]("click", false, false);
  // 定义下载文件名称
  aLink.download = fileName;
  // 根据File对象创建文件 dataURL
  aLink.href = URL.createObjectURL(file);
  // 触发事件下载
  aLink.dispatchEvent(evt);
}