LANG SELRCT

コードを書く場所についてはこちら

2018年5月6日日曜日

テキストエリアの値をローカルにダウンロードする


テキストエリアに入力したテキストをローカルにダウンロードしたい







コード.gs
function doGet() {
  return HtmlService.createHtmlOutputFromFile("index");
}
意訳
この機能がやること
指定したHTMLファイルを表示する




index.html
<!DOCTYPE html>
<html>
  <body>
    <textarea id="ta"></textarea><br>
    <input type="text" id="file_name" value="ファイル名">
    <input type="text" id="content_type" value="text/plain"><br>
    <button id="button">Download</button>
    <script>
  var download_button = document.getElementById("button");
  download_button.onclick = download;

  function download() {
    var data = document.getElementById("ta").value;
    var file_name = document.getElementById("file_name").value;
    var content_type = document.getElementById("content_type").value;
    var blob = new Blob([data], {"type":content_type});
    
    var link = document.createElement("a");
    link.download = file_name;
    link.href = window.URL.createObjectURL(blob);
    link.click();
  }
    </script>
  </body>
</html>
意訳
 


テキスト入力エリア
ファイル名を入れるテキストボックス
ContentTypeを指定するテキストボックス
ダウンロードボタン

idがbuttonの要素を取得して
クリックされたらdownloadを実行する

この機能がやること
テキストエリアの値を取得して
ファイル名を取得して
content_typeを取得して
Blobに入れて

a要素を作成して
ダウンロードするファイル名に指定して
URLを作成して
クリックしてダウンロードする