jiichan.com

PROGRAMMING

ファイルを作成しローカルに保存

申告に必要なデータをサーバーから取り出しcsvにする必要がありました。
javaだと契約しているサーバーにアクセスできないのでjavascriptで出来ないか調べたらいい方法があったので忘れないようにメモしておきます。
ファイルは<a>タグのダウンロードを利用しますのでダウンロードフォルダに保存されます。

ダウンロード用のHTML

ダウンロード用のアンカータグを配置します。


<a href="#" id="shinkoku">確定申告用csvダウンロード</a>
 

アンカータグのhref属性とダウンロード属性はjavascript側で指定しました。

ファイルを作ってそのファイルをダウンロードフォルダに保存

プロトタイプで関数MkenCalendarに各月の日数を追加します。2月の閏月の日数の変更は別のメソッドで行います。
年月日が見やすいように、年月日の区切り文字もセットしておきました。


$.getJSON("csv.php", {"year":year}, function(jsonStr){
	var csvStr = "";
	$.each(jsonStr, function(i, obj){
		csvStr += obj.data + "," + 
		obj.money + "," + 
		obj.memo + "," +
		obj.shop + "\n"; 
	});

	// ダウンロード処理
	var blob = new Blob([csvStr], {type: "text/plain"});
	if(window.navigator.msSaveOrOpenBlob){  // IE
		window.navigator.msSaveOrOpenBlob(blob, "shinkoku.csv");
	}else{                                  // IE以外
		var obj = document.getElementById("shinkoku");
		var blob_url = window.URL.createObjectURL(blob);	
		obj.href = blob_url;
		obj.download = "shinkoku.csv";
	}
});

 ・ 11行目:プレーンテキストのcsvStrをコンテンツとしたBlobオブジェクトを作る。
 ・ 16行目:createObjectURLで指定ファイルの内容全体がエンコードされ、URLテキストになる。
 ・ 17行目:アンカータグのリンク先にURLテキストを指定する。
 ・ 18行目:アンカータグのダウンロード属性に保存するファイル名を指定する。

13行目のmsSaveOrOpenBlob()は16行目から18行目までを一発でできる。(IE)


【Blobコンストラクタのオプションいろいろ】


var blob = new Blob([file], {type: "image/png"});
var blob = new Blob([binary], {type: "application/octet-binary"});
var blob = new Blob(["文字列"], {type: "text/plain"});
var blob = new Blob(["<html>"], {type: "text/plain;charset=UTF-8"});

これは便利に使えます。

-->