JavaScript+WebAPIでシステム構築をしていると意外と悩むのがファイルダウンロード、アップロード。
多くの場合はWebAPIでダウンロードファイルの情報を照会して別途ダウンロードを行ったり
サーバー上にファイルをアップロードしてからWebAPIを呼び出して更新処理を行う方法が
一般的だったが、最近はWbAPIを使って直接ファイルのアップロード、ダウンロードを行うことができる。(疑似的だが)
■ダウンロード
var data = { "layer_no": layer_no, "point_no": point_no, "crc": crc }; m_web_service.call("exportPtaPolygon", function (data, textStatus, xhr) { if(!cmn_is_null(data.d)){ if(cmn_is_null(data.d.lats)){ m_common.MsgBox("エクスポート", "エクスポート対象のデータはありません", 0, 0); m_window.Close("600"); return; } var csv = ""; for(var i = 0 ; i < data.d.lats.length ; i++){ csv = csv + data.d.lats[i] + "," + data.d.lons[i] + "\r\n"; } let downloadData = new Blob([csv], {type: 'text/csv'}); let filename = 'PTA.csv' if (window.navigator.msSaveBlob) { window.navigator.msSaveBlob(downloadData, filename); // IE用 } else { let downloadUrl = (window.URL || window.webkitURL).createObjectURL(downloadData); let link = document.createElement('a'); link.href = downloadUrl; link.download = filename; link.click(); (window.URL || window.webkitURL).revokeObjectURL(downloadUrl); } m_window.Close("600"); } else{ } }, m_common.dummy_function, data);
■アップロード
var fileref = document.getElementById(id); var reader = new FileReader(); reader.onload = function(theFile){ var outhtml = theFile.target.result; var recs = outhtml.split("\r\n"); if(recs.length < 4){ m_common.MsgBox("インポート", "正しいファイルを指定してください", 400, 200); return; } var xs = []; var ys = []; for(var n = 0 ; n < recs.length ; n++){ let yx = recs[n].split(","); if(yx.length == 2){ ys.push(parseFloat(yx[0])); xs.push(parseFloat(yx[1])); } } var data = { "layer_no": layer_no, "point_no": point_no, "crc": crc, "xs" : xs, "ys" : ys, "user_no" : String(m_master.user_no) }; m_common.waitmsg_on(); m_web_service.call("importPtaPolygon", function (data, textStatus, xhr) { m_common.waitmsg_off(); if(data.d){ m_common.MsgBox("インポート", "インポートしました", 400, 200); } else{ m_common.MsgBox("インポート", "インポートできません", 400, 200); } m_window.Close("600"); }, m_common.dummy_function, data); } reader.readAsText(fileref.files[0], "shift-jis");