ページ

2011年12月6日

Webページからファイルをデスクトップにドラッグアウトする

Gmailは、ChromeやFirefoxだと添付ファイルをデスクトップにドラッグアンドドロップで保存できます。IE? 何それ? おいしいの? なので、IEのことはよく知りません。IE8だと動いてくれませんでした。(Firefoxもウソだ。やっぱり動かなかった。)このページにその方法が書かれています。Drag and Drop APIっていうのを使うらしいです。とりあえず、サンプルコード。

<html>
  <body>
    <a href="some.png"
       draggable="true"
       ondragstart="event.dataTransfer.setData('DownloadURL',
        'image/png:some.png:http://localhost:8080/some.png');">
      file link
    </a>
  </body>
</html>

これだけです。リンクをドラッグアンドドロップえきるようにして、ondragstartイベントでdataTransferにsetDataするだけです。セットするのはmime typeとファイル名、ファイルへのリンクです。mime-typeはapplication/octet-streamでも大丈夫です。ファイルへのリンクは相対パスではダメで、絶対パスで書かないと行けないのがめんどいです。でも、これだけでデスクトップへのドラッグアンドドロップでの保存ができるので、簡単です。
でも、僕はドラッグアンドドロップではほとんど保存しないですが…

でわでわ

0 件のコメント: