Safariでファイルをダウンロードする

by bc_rikko

HTML

<script src="https://cdn.rawgit.com/eligrey/FileSaver.js/master/FileSaver.min.js"></script>
<button id="dl0">FileSaver.js</button>
<button id="dl1">a tag download</button>
<button id="dl2">application/octet-stream</button>

CSS

body {
  background-color: white;
}

button {
  margin: 10px;
  width: 200px;
  height: 50px;
  
  border: none;
  background-color: #6DB7F7;
  box-shadow: 2px 2px 2px 2px rgba(0,0,0,0.4);
  
  color: white;
  font-size: 1em;
}

JavaScript

document.getElementById('dl0').addEventListener('click', () => {
  const blob = new Blob(['hoge'], { type: 'text/plain' });
  saveAs(blob, 'dl0.txt');
});

document.getElementById('dl1').addEventListener('click', () => {
  const blob = new Blob(['hoge'], { type: 'text/plain' });
  const a = document.createElement('a');
  a.href = window.URL.createObjectURL(blob);
  a.download = 'dl1.txt';
  a.target = '_blank';
  
  a.click();
});

document.getElementById('dl2').addEventListener('click', () => {
  const blob = new Blob(['hoge'], { type: 'application/octet-stream' });
  saveAs(blob, 'dl2.txt')
});