58
56

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

javascriptからファイル保存ダイアログを出す

Last updated at Posted at 2014-05-06

jsでファイルを保存するための方法.
html5をサポートしたブラウザなら動くはず.
投稿してから気がつきましたがほとんど同じ内容の投稿がありました.
javascriptで生成したファイルをローカルに保存する - Qiita

しかし,少しだけ記事の趣旨が違うのでこの記事も残しておきます.

手順

a要素を作成する.
a要素のhrefにダウンロードしたいリンクを代入する.
a要素にdownload属性に値をつける.
download属性にセットした値がファイル名となる.(拡張子はつけない方がよい)
a要素にクリックイベントを発生させる.

実際のコード

download.js
function download(url, name){
    var a = document.createElement('a');
    a.href = url;
    a.setAttribute('download', name || 'noname');
    a.dispatchEvent(new CustomEvent('click'));
}

上記の関数のurlにダウンロードしたいリンク,nameにファイル名を入れればよい.
safariやieでは動かない.
createObjectURLを組み合わせればArrayBufferなどを保存することもできる.

58
56
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
58
56

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?