スプレッドシート内にメニューを追加し、指定したタイプの Json ファイルを書き出すことが出来ます。
ここでは２つのタイプに対応しています。
＜メニュー＞
＜通常のJson＞
＜内部の配列を持つ Json＞
dialogJson.gs の作成 
Json 形式の出力を行いたいスプレッドシートを開き、「拡張機能 → Apps Script」を選択します。
Apps Script が新しいタブやウインドウで開きますので、「＋」ボタンを押して、スクリプトを作成します。
dialogJson.gs
function generateJson() {
const jsonKey = 'data'; // jsonのkey名
// データの取得
const sheet = SpreadsheetApp.getActiveSpreadsheet(); //.getSheetByName('シート名');
const lastRow = sheet.getLastRow();
const lastColum = sheet.getLastColumn();
const keys = sheet.getSheetValues(1, 1, 1, lastColum).flat();
const values = sheet.getSheetValues(2, 1, (lastRow-1), lastColum);
// データの整形
const data = values.map(currentValue => {
return keys.reduce((obj, currentKey, index) => {
obj[currentKey] = currentValue[index];
return obj;
}, {});
});
const json = JSON.stringify(data);
return json;
}
function onOpen() {
const ui = SpreadsheetApp.getUi();
ui.createMenu('json')
.addItem('json形式でダウンロード', 'downloadDialog')
.addToUi();
};
function downloadDialog() {
const html = HtmlService.createTemplateFromFile("dialog").evaluate();
SpreadsheetApp.getUi().showModalDialog(html, 'json形式でダウンロード');
}
dialog.html の作成
続いて「＋」ボタンを押し、HTML を選択してファイルを作成します。
dialog.html
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body>
<button onclick="dl()">ダウンロードが始まらない場合はクリック</button>
<script type='text/javascript'>
function dl() {
const json = <?= generateJson(); ?>;
const blob = new Blob([json], {
"type" : "application/json"
});
const link = document.createElement('a');
link.href = window.URL.createObjectURL(blob);
link.download = 'data.json';
link.click();
}
dl();
</script>
</body>
</html>
スプレッドシートの再読み込み
各ファイルを保存後、スプレッドシートの再読み込みを行ってください。
上部のメニューに Json が追加されます。
実行すると開いているシート内の情報が Json ファイルで出力されます。
＜データの一部を配列としてまとめて出力するケース＞
もう１つの出力方式を作成します。
「＋」ボタンを押してスクリプトを作成します。
exportToJson.gs
function exportToJson() {
// シート名を指定
const sheet = SpreadsheetApp.getActiveSpreadsheet(); //.getSheetByName('シート14'); // シート名は適切に変更
// データを取得
const data = sheet.getDataRange().getValues();
// ヘッダー行を取得
const headers = data[0];
// データをJSON形式に変換
const jsonData = [];
for (let i = 1; i < data.length; i++) {
const row = data[i];
const obj = {};
obj['tag'] = row[0];
// 'jp', 'kr', 'en' の列を配列にまとめる
obj['languageDatas'] = [row[1], row[2], row[3]];
jsonData.push(obj);
}
// JSONデータを出力
const jsonOutput = JSON.stringify(jsonData, null, 2);
// HtmlServiceのダイアログを閉じるために出力
return jsonOutput;
}
function onOpen() {
const ui = SpreadsheetApp.getUi();
ui.createMenu('Custom Menu')
.addItem('JSON形式でダウンロード', 'downloadDialog')
.addToUi();
}
function downloadDialog() {
const html = HtmlService.createTemplateFromFile('combinedDialog').evaluate();
SpreadsheetApp.getUi().showModalDialog(html, 'JSON形式でダウンロード');
}
function getSheetName() {
const sheet = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
return sheet.getName();
}
dialogJson.gs の修正
downloadDialog() 関数内の引数の指定を変更します。
また新しく getSheetName() 関数をこちらにも追加します。
function downloadDialog() {
const html = HtmlService.createTemplateFromFile('combinedDialog').evaluate();
SpreadsheetApp.getUi().showModalDialog(html, 'JSON形式でダウンロード');
}
function getSheetName() {
const sheet = SpreadsheetApp.getActiveSpreadsheet().getActiveSheet();
return sheet.getName();
}
HTML ファイル
スプレッドシートには１つの HTML ファイルしか設定できないため、
先ほど作成した通常の Json ファイルのダウンロード機能に、今回の一部を配列化して Json ファイルとしてダウンロード機能を追加します。
また作成される Json ファイルの名称も動的にシート名に設定されるように変更もしています。
そのため、HTML の名称も変更しましょう。
combinedDialog.html
<!-- combinedDialog.html -->
<!DOCTYPE html>
<html>
<head>
<base target="_top">
</head>
<body>
<button onclick="exportJson()">JSON形式(一部配列)でダウンロード</button>
<button onclick="dl()">通常のJSON形式でダウンロード</button>
<script type='text/javascript'>
function getSheetName() {
return google.script.run.getSheetName();
}
function exportJson() {
google.script.run.withSuccessHandler(function(sheetName) {
const json = <?= exportToJson(); ?>;
const blob = new Blob([json], {
type: 'application/json'
});
const link = document.createElement('a');
link.href = window.URL.createObjectURL(blob);
link.download = `${sheetName}.json`; // シート名をファイル名に設定
link.click();
}).getSheetName();
}
function dl() {
google.script.run.withSuccessHandler(function(sheetName) {
const json = <?= generateJson(); ?>;
const blob = new Blob([json], {
type: 'application/json'
});
const link = document.createElement('a');
link.href = window.URL.createObjectURL(blob);
link.download = `${sheetName}.json`; // シート名をファイル名に設定
link.click();
}).getSheetName();
}
</script>
</body>
</html>
スプレッドシートの再読み込み
各ファイルを保存後、スプレッドシートの再読み込みを行ってください。
上部のメニューに Json を選択すると、ウインドウ内に新しいメニューが追加されています。
＜メニュー＞
両方とも実行して、それぞれの Json 形式での出力が行われることを確認してみてください。
＜通常のJson＞
＜内部の配列を持つ Json＞
以上で完成です。