済Googleスプレッドシートへの画像URLの挿入

チャットボットプラスではテキストフォームに入力した内容をGoogleスプレッドシートに保存できます。
GoogleスプレッドシートとはGoogle社が提供している表計算ソフトで、Excelの様に関数を入力したり、グラフを作成できます。またExcelと異なる点としては、同時編集が可能なことや自動保存機能が備わっていることです。大変便利なこのGoogleスプレッドシートとチャットプラスを連携させる方法を、今回ご案内します。

このページでは、チャットボットプラスのテキストフォームに入力された画像ファイルのURLを、Googleスプレッドシート上に記録する方法をご紹介します。

Googleスプレッドシートの準備

コードの設置

(1)内容を記録するGoogleスプレッドシートを開き、メニューから「ツール」＞「スクリプトエディタ」をクリックします。
※Googleスプレッドシートがない場合は、新しく作成してください。

(2)「スクリプトエディタ」を開くと「function myFunction() { }」と書かれたエディタが表示されるので、以下のコードをコピーし、エディタに上書きしてペーストします。

function doPost(e) {

  var date = new Date();
  var ss = SpreadsheetApp.openById(SpreadsheetApp.getActiveSpreadsheet().getId());
  var sheet = ss.getSheetByName("シート1");
  var all = e.parameter.data;
  let lastRow = sheet.getLastRow();
  
  sheet.getRange((lastRow+1),1).setValue(date);
  sheet.getRange((lastRow+1),2).setValue(all);
  
  var jsonString = sheet.getRange((lastRow+1),2).getValue();
  var data = JSON.parse(jsonString);
  
  var range = sheet.getRange((lastRow+1),2);
  range.clearContent();
  
  var file_url = data.message.filter(function(item, index){
     if (item.type == "image") return true;
  });

  for (let i = 0; i < file_url.length; i++) {
     sheet.getRange((lastRow+1),(i+2)).setValue(file_url[i].originalContentUrl);
  }
}

Googleスプレッドシートに反映

(1) Googleスプレッドシートのメニューから、「公開」＞「ウェブアプリケーションとして導入...」をクリックします。

(2) プロジェクト名を変更する様表示されるので、任意のプロジェクト名を入力します。

(3) 以下の画面が表示されるので、「Project version」のプルダウンから「New」を、「Execute the app as」のプルダウンから「Me」を、「Who has access to the app」のプルダウンから「Anyone, even anonymous」を、それぞれクリックして選択します。
※「Project version」のプルダウンで「New」を選択した後、枠内には任意の値を入力します（空欄でも可）