[HTML5]利用ajax做檔案下載

同事說不可能用1個ajax去下載檔案

於是乎我就研究了一下
程式碼如下：

js code:

<script>
$(function(){
 $.ajax('/ajax/getFile', {dataType:'json', success:function(data){
   var bb = new Blob([data.content], {type: 'application/octet-binary'});
   $('#link')
   .attr({download:'file.bin',href:window.URL.createObjectURL(bb)})
 }});
});
</script>

其實這是利用<a>的download屬性(Working Draft:w3schools)
加上Blob這物件將檔案內容轉為blob格式使得瀏覽器可以下載

html:

<div id="main">
 <a id="link">Download File</a>
</div>

backend: (use nodejs express)

exports.getFile = function(req, res){
 fs.readFile('file', function (err, data) {
  res.json({status:'ok',content:data.toString()});
 });
};

reference:
http://caniuse.com/download
http://html5-demos.appspot.com/static/a.download.html