![はる](https://push.tokyo/wp-content/uploads/2021/03/B5B68860-40FE-40B4-B42D-E6899D559632.png)
はる
Google スプレッドシートのデータを JSON 形式でダウンロードしたいと思ったことはありますか? この記事では、Google スプレッドシートのデータを複数シート対応で JSON 形式でダウンロードする方法を紹介します。
シートの用意
まず、スプレッドシートを用意します。
![](https://push.tokyo/wp-content/uploads/2023/03/cc1b0c6a85b8b402e875571453eea1c0-1024x642.png)
- 上記画像のようにタブで『sheet1』から『sheet4』を作成します。
- 1行目にはラベルを記述し
- 2行目にはJSONのkeyを設定します。
- 3行目以降はデータを入力していきます。
手順1: Google Apps Script の設定
まず、Google スプレッドシートを開いてください。次に、「ツール」メニューから「スクリプト エディタ」を選択して、Google Apps Script のエディタを開きます。
手順2: コードの入力
以下のコードをコピーし、コード.gs に貼り付けてください。
// JSON ダウンロード用ダイアログを表示する関数
function displayJSONDownloadDialog() {
// ダイアログの HTML テンプレートを読み込む
var dialogHtml = HtmlService.createHtmlOutputFromFile("dl");
// ダイアログを表示する
SpreadsheetApp.getUi().showModalDialog(dialogHtml, "JSON 形式でダウンロード");
}
// シートのデータを取得し、JSON 文字列に変換する関数
function fetchSheetData(sheetName) {
// 指定された名前のシートを取得する
var sheet = SpreadsheetApp.getActiveSpreadsheet().getSheetByName(sheetName);
if (sheet == null) {
throw new Error("シートが見つかりません: " + sheetName);
}
// シート内の最終行と最終列の番号を取得する
var lastRow = sheet.getLastRow();
var lastColumn = sheet.getLastColumn();
// JSON オブジェクトのキーを格納する配列を作成する
var jsonKeys = [];
// データを格納する配列を作成する
var jsonData = [];
for (var x = 1; x <= lastColumn; x++) {
jsonKeys.push(sheet.getRange(2, x).getValue());
}
// シートのデータを取得し、JSON オブジェクトに変換する
for (var y = 4; y <= lastRow; y++) {
var jsonObject = {};
for (var x = 1; x <= lastColumn; x++) {
jsonObject[jsonKeys[x-1]] = sheet.getRange(y, x).getValue();
}
// JSON オブジェクトを配列に追加する
jsonData.push(jsonObject);
Logger.log(jsonData);
}
// JSON 配列を整形し、文字列として返す
return JSON.stringify(jsonData, null, '\t');
}
// スプレッドシートが読み込まれたときに実行される関数
function onOpen() {
// メニューバーに「JSON で出力」メニューを追加する
var spreadsheet = SpreadsheetApp.getActiveSpreadsheet();
var menuEntries = [{
name : "JSONで出力",
functionName : "displayJSONDownloadDialog"
}];
spreadsheet.addMenu("JSON", menuEntries);
}
手順3: HTMLファイルの作成
次に、エディタで新しい HTML ファイルを作成し、「dl.html」という名前を付けてください。以下のコードをコピーし、作成した HTML ファイルに貼り付けます。
<!DOCTYPE html>
<html>
<head>
<base target="_top">
<!-- JavaScriptを含むスクリプトタグ -->
<script type='text/javascript'>
// シート名を引数として受け取り、ダウンロード処理を行う関数
function handleDownload(sheetName) {
// スプレッドシートからデータを取得し、ダウンロードリンクを作成
google.script.run.withSuccessHandler(function(content) {
var blob = new Blob([content], { "type": "application/json" });
var linkElement = document.createElement('a');
linkElement.href = window.URL.createObjectURL(blob);
linkElement.download = sheetName + '.json';
linkElement.click();
}).fetchSheetData(sheetName);
}
</script>
</head>
<body>
<!-- シート1のダウンロードボタン -->
<h2>シート1</h2>
<button onclick="handleDownload('sheet1')">ダウンロード</button>
<!-- シート2のダウンロードボタン -->
<h2>シート2</h2>
<button onclick="handleDownload('sheet2')">ダウンロード</button>
<!-- シート3のダウンロードボタン -->
<h2>シート3</h2>
<button onclick="handleDownload('sheet3')">ダウンロード</button>
<!-- シート4のダウンロードボタン -->
<h2>シート4</h2>
<button onclick="handleDownload('sheet4')">ダウンロード</button>
</body>
</html>
![](https://push.tokyo/wp-content/uploads/2023/03/09b4485795c4dbac7db438d07c3a8256.png)
手順4: スクリプトの保存と実行
すべてのコードが入力されたら、「ファイル」メニューから「保存」を選択してスクリプトを保存します。その後、スプレッドシートに戻り、リロードします。
リロード後、メニューバーに「JSON」メニューが追加されていることが確認できます。「JSON」メニューから「JSONで出力」を選択すると、ダウンロード用のダイアログが表示されます。
![](https://push.tokyo/wp-content/uploads/2023/03/e4ff5f72a7e0689799e6e57bd5ea1498.png)
ダウンロードボタンを押下することでjsonファイルがダウンロードされるかと思います。
まとめ
以上が、Google スプレッドシートのデータを複数シート対応で JSON 形式でダウンロードする方法です。ぜひお試しください。
参考記事
![](https://qiita-user-contents.imgix.net/https%3A%2F%2Fcdn.qiita.com%2Fassets%2Fpublic%2Farticle-ogp-background-9f5428127621718a910c8b63951390ad.png?ixlib=rb-4.0.0&w=1200&mark64=aHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTkxNiZoPTMzNiZ0eHQ9JUUzJTgyJUI5JUUzJTgzJTk3JUUzJTgzJUFDJUUzJTgzJTgzJUUzJTgzJTg5JUUzJTgyJUI3JUUzJTgzJUJDJUUzJTgzJTg4JUUzJTgxJThCJUUzJTgyJTg5anNvbiVFMyU4MiU5MiVFNCVCRCU5QyVFMyU4MiU4QiZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTU2JnR4dC1jbGlwPWVsbGlwc2lzJnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnM9NjkxMmRhMDMyMmNiYWU2MTJiZDM3ZWQ1ZGI3NGVlZDE&mark-x=142&mark-y=112&blend64=aHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTcxNiZ0eHQ9JTQwWWFtaV8zNyZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTMyJnR4dC1hbGlnbj1sZWZ0JTJDdG9wJnM9ZDE3Mjg2YzI3ZGUxMTZlYTNkNzhlM2UyY2MwYzQxZGM&blend-x=142&blend-y=491&blend-mode=normal&s=a5fee3ace667e2bdc2d6df5ebc6ae1d0)
スプレッドシートからjsonを作る - Qiita
やりたいことスプレッドシートからjsonを作りたい。見出しをkeyにするパターンと{id:001, name=aaa, flg=true},{id:002, name=bbb, flg=fal…