名前付きでファイル保存可能なブラウザを検知するには？

HTML5でファイル保存を行うなら、今のところeligrey氏の「FileSaver.js」が鉄板だと思う。

しかし残念がら、SafariやOperaではダウンロードフォルダに保存する方式でなく、新しいタブを開いて保存することになる。つまりファイルに名前をつけられない＿|￣|○

これではとても「使える」という状態ではないので、SafariやOpera（ver.12。ver.15はOK。）は非サーポートブラウザにしようと考えた。

ここで問題なのは、どういった判断でサポート可能かどうかを検知するかだ。始めはユーザーエージェントで判断するしか無いか？と思ったのだけど、ソースを見たら、それらしき箇所が見つかった。

...
, save_link = doc.createElementNS("http://www.w3.org/1999/xhtml", "a")
, can_use_save_link = "download" in save_link
...

どうやら、xhtmlでaタグエレメントオブジェクトを作り、そのプロパティーとして「download」が存在するかどうかで判断しているようだ。

これに加えて、IE10では「navigator.msSaveOrOpenBlob」で判断しているようだ。

なので、このようにHTMLのHEAD内で同様の判断をすれば検知できるということが分かった。

var aTag = document.createElementNS("http://www.w3.org/1999/xhtml", "a");
var isSaveOK = navigator.msSaveOrOpenBlob || "download" in aTag;
if (isSaveOK) {
  alert("対応ブラウザ");
} else {
  alert("非対応ブラウザ");
}

ここで一つ疑問に思ったのは、なぜわざわざ「in」演算子を使うのだろう？ということ。「aTag.download」でもいいのでは？と。

こちらによると、「in」と「.」では意味が違う部分があるそうだ。

in演算子の使用法：続JavaScriptのオブジェクトについて - builder

きっと何か意味があると思うので、ソースの通り「in」を使っておいた方が無難だろう。