ローカルファイルを読み込む
Googleスプレッドシートはサーバー上に存在するため、ローカルファイルを処理するには一工夫する必要があります。
そこで、ローカルファイルをスプレッドシートに読み込むサンプルコードを紹介してみようと思います。
サンプルコード
GoogleAppsScript の コード.gs
と、GoogleAppsScript から呼び出す HTMLファイルの dialog.html
、そしてアップロードするローカルファイル upload.txt
を用意します。
コード.gs
function main() { var html = HtmlService.createHtmlOutputFromFile("dialog"); SpreadsheetApp.getUi().showModalDialog(html, 'ローカルファイル読込'); } function writeSheet(formObject) { // フォームで指定したテキストファイルを読み込む var fileBlob = formObject.myFile; // テキストとして取得(Windowsの場合、文字コードに Shift_JIS を指定) var text = fileBlob.getDataAsString("sjis"); // 改行コードで分割し配列に格納する var textLines = text.split(/[\s]+/); // 書き込むシートを取得 var sheet = SpreadsheetApp.getActiveSheet(); // テキストファイルをシートに展開する for (var i = 0; i < textLines.length; i++) { sheet.getRange(i + 1, 1).setValue(textLines[i]); } // 処理終了のメッセージボックスを出力 Browser.msgBox("ローカルファイルを読み込みました"); }
dialog.html
<!DOCTYPE html> <html> <head> <base target="_top"> <script> // すべてのフォームをイベントリスナーに登録する function preventFormSubmit() { var forms = document.querySelectorAll('form'); for (var i = 0; i < forms.length; i++) { forms[i].addEventListener('submit', function(event) { event.preventDefault(); }); } } window.addEventListener('load', preventFormSubmit); // フォームのサブミットで呼ばれる処理 function readFile(formObject) { // GASで定義した関数を呼び出す google.script.run.writeSheet(formObject); } </script> </head> <body> <form id="myForm" onsubmit="readFile(this)" enctype="multipart/form-data"> <input name="myFile" type="file" /><br> <button type="submit">読込</button> </form> </body> </html>
upload.txt
一行目 二行目 三行目
実行の流れ
当サンプルコードを実行した時の流れです。
スクリプトエディタより
main()
を実行すると、スプレッドシート上にローカルファイルのアップロード用ダイアログが表示される「ファイルを選択する」よりアップロードするローカルファイルを指定する
「読込」ボタンを押して処理開始
読込みが終了すると「ローカルファイルを読み込みました」とポップアップが表示される
ローカルファイルの値がスプレッドシートに書き込まれている
解説
前述したように Googleスプレッドシートはサーバー上に存在しているため、ローカルファイルを直接処理することができません。処理するためには仲介役が必要になります。ここではダイアログが仲介役となります。
プログラムの流れ
- GAS側の
function main()
を実行しdialog.html
をもとにしたダイアログを表示する - アップロードするローカルファイルを指定したあと、ダイアログの「読込」ボタンを押すことで
<form>
のonsubmit
に指定したreadFile(this)
が実行される。ここでthis
には form の情報が設定される function readFile(formObject)
でgoogle.script.run.writeSheet(formObject)
を呼び出し、form の情報を HTMLからGASへ受け渡す- GASの
function writeSheet(formObject)
ではvar fileBlob = formObject.myFile
によりローカルファイル情報を Blob 型で受け取る - Blob 型をテキストとして処理するため
var text = fileBlob.getDataAsString("sjis")
とする。なお Windows 環境のテキストファイルであるため文字コードに Shift_JIS を指定している - テキストデータの改行コードを処理するため
var textLines = text.split(/[\s]+/)
とし、テキストデータの各行を配列に分割する - これでテキストデータを配列に格納できたため、あとはスプレッドシートに設定して終了となる
補足
preventFormSubmit()
について
dialog.html
のpreventFormSubmit()
は上記説明で登場しませんでしたが、これは <form>
を使用する際に必要となるもので、これを記述することでボタン押下時のイベントが正しく起動するようになっています。ですので必ず記述するようにしてください。