GASでスプレッドシートに入力されたのをチャットワークに転送する

Question

前提・実現したいこと

ここに質問の内容を詳しく書いてください。
背景：googleフォームに相談やお問い合わせが来た際にchatworkに内容とともに通知が来るよう設定をしたい。

内容：googleフォームに入力された内容をスプレッドシートに展開し、その内容をチャットワーク（マイページ）に転送を行いたい。

発生している問題・エラーメッセージ

"相談内容を受信しました"

などの文章をGASからチャットワークのマイページに転送することはできたが、内容を引っ張ってくることができない。

試したこと

ネット検索した際に、「googleのお問い合わせフォームをチャットワークに転送する」というのを見つけ他のですが、認証されていないライブラリを使うとのことで、今回作成したいシステムが社内システムのためセキュリティ問題が恐く他の方法を探しています。

当方JavaScript初心者であるため引数に何を入れれば良いのかなどで困っています。

補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。

Answer 1

回答にあたって

GASからチャットワークへの転送は成功しているとのことなので、フォームに回答があったタイミングでその内容をGASで取得する方法を回答させていただきます。

スプレッドシートに展開し

このあたりは考慮していませんので問題があれば返信をお願いします。

GASでフォーム送信時に内容を取得する方法

これを行うためにはフォーム上にスクリプトを作成し、トリガー機能を利用しフォーム送信時にイベントを発生させます。

フォーム上にスクリプトを作成する

フォームの編集画面で ... ボタンを押し、スクリプトエディタを選択。
(画面が狭いとスクリプトエディタメニューが表示されないので注意してください。)

トリガーで実行される関数を定義する

スクリプトエディタのコード.gsに以下の関数を定義します。

function onSubmit(e) {
  let itemResponses = e.response.getItemResponses();
  for (var j = 0; j < itemResponses.length; j++) {
      var itemResponse = itemResponses[j];
      Logger.log('質問 : "%s", 回答 : "%s"',
        itemResponse.getItem().getTitle(),
        itemResponse.getResponse());
    }
}

ここでは一例として受け取った回答をログに記録するコードを書きました。
適宜必要な回答を抜き出してチャットワークへ転送するコードへ書き換えてください。
e.responseは FormResponseクラスのインスタンスです。利用可能なプロパティは 公式ドキュメント を参照してください。

トリガーを定義する

スクリプトエディタの左側メニューのトリガーをクリックし、＋ トリガーを追加ボタンをクリック

• 実行する関数を選択から上で定義した関数を選択。（コードを保存していないと表示されないので注意してください。）
• イベントの種類を選択からフォーム送信時を選択
• 保存ボタンをクリック

• 保存時に以下のようなアカウント選択を求められることがあります。

  • これは現在作成中のプログラムの実行を許可するものです。
  • アカウント設定から取り消すこともできます。

• 次の手順で権限の許可を行ってください。

• ご自身のアカウントをクリック

• 詳細をクリックし、～～に移動をクリック

• 許可をクリック

• トリガー作成画面に戻って改めて保存ボタンを押してください。
• トリガー作成に成功すると以下のような画面になるはずです。

動作の確認

ここまでできたらフォーム編集画面のプレビューから適当な回答を送ってみてください。
スクリプトエディタの左側メニューの実行数をクリックすると、項目が一つ追加されます。
コードにエラーがない場合はステータスが完了になります。項目をクリックするとCloudのログにLogger.logで出力した内容が記録されているはずです。（表示されない場合は追加の設定が必要かもしれません。）
コードに問題がある場合はステータスが失敗しましたとなり、エラーメッセージが表示されます。

チャットワークへのメッセージ送信

チャットワークへのメッセージ送信まで考慮すると以下のようなコードになります。

function onSubmit(e) {
  let itemResponses = e.response.getItemResponses();
  let message = itemResponses[0].getResponse();

  postMessage(message);
}

function postMessage(message) {
  let CW_ROOM_ID = "チャットワークのID";
  let CW_TOKEN = "チャットワークのAPI TOKEN";
  let POST_TEXT = "相談内容が入力されました：\r\n" + message;
  // 送信データ
  let params = {
    headers: { "X-ChatWorkToken": CW_TOKEN },
    method: "post",
    payload: {
      body: POST_TEXT
    }
  };
  let url = "https://api.chatwork.com/v2/rooms/" + CW_ROOM_ID + "/messages";
  UrlFetchApp.fetch(url, params);
}

ただし、let message = itemResponses[0].getResponse(); の部分は、質問内容の１番目の文字列を取得するという動作になります。
お作りになられたフォーム次第で[]の中の数字を変更する必要があります。

フォームに投稿せずに動作を確認したい場合は以下の関数を定義してスクリプトエディタから実行してください。

function testOnSubmit() {
  let form = FormApp.getActiveForm();
  var formResponses = form.getResponses();
  onSubmit({ response: formResponses[0] });
}

Comments

[tyawanmushi2]

細かくわかりやすい回答を有難うございます。
このまま実行をすると以下のエラーが出ます。

TypeError: Cannot read property 'response' of undefined
onSubmit @ コード.gs:2

これを回答者様の【e.responseは FormResponseクラスのインスタンスです。利用可能なプロパティは 公式ドキュメント を参照してください。】というところで何か変更を加えるとエラーが消えるという解釈でよろしかったでしょうか。

再度質問を投げかけてしまい申し訳ございません。
お時間がある時で構いませんのでご返答いただけますと幸いです。

[miyaharu]

確認ですが
```js
function onSubmit(e) {
```
の e を記入し忘れていないでしょうか？
また、この関数はトリガーから呼び出す前提なので、通常のデバッグ実行などでは e が定義されておらずエラーが出ます。

[miyaharu]

動作確認のためにデバッグ実行を行いたい場合は以下の関数を定義することで、1つ目の回答に対する動作をシミュレーションできます。（回答が１つもない場合はエラーになります）

function testOnSubmit() {
let form = FormApp.getActiveForm();
let formResponses = form.getResponses();
onSubmit({ response: formResponses[0] });
}

[tyawanmushi2]

miyaharu様の【function onSubmit(e) {
let itemResponses = e.response.getItemResponses();
for (var j = 0; j < itemResponses.length; j++) {
var itemResponse = itemResponses[j];
Logger.log('質問 : "%s", 回答 : "%s"',
itemResponse.getItem().getTitle(),
itemResponse.getResponse());
}
}】こちらをペーストさせていただいたので【function onSubmit(e)】の脱字はないです！

[tyawanmushi2]

【追記】
スプレッドシートからチャットワークにメッセージを送る際は

function myFunction() {
let CW_ROOM_ID = "チャットワークのID";
let CW_TOKEN = "チャットワークのAPI TOKEN";
let POST_TEXT = "相談内容が入力されました";
// 送信データ
let params = {
headers : {"X-ChatWorkToken" : CW_TOKEN},
method : "post",
payload : {
body : POST_TEXT
}
};
let url = "https://api.chatwork.com/v2/rooms/" + CW_ROOM_ID + "/messages";
UrlFetchApp.fetch(url, params);
}

こちらを利用しておりました。
この文章とmiyaharu様のコードどちらを先に記述すれば良いでしょうか

[miyaharu]

> 脱字はないです！
了解しました。

回答の通りトリガーから呼び出して失敗しているのであれば、原因はよくわかりません。
私の環境では動いているので、手順に間違いがない確認をお願いします。

> スプレッドシートからチャットワークにメッセージを送る際は
”スプレッドシートから”なのは何か理由があるのでしょうか？
今回の仕様であればフォームのスクリプトで十分な気がします。

送信処理部分に関しては、回答側に追記させていただきます。

[tyawanmushi2]

＞"スプレッドシートから"なのは何か理由があるのでしょうか？
以前見ていたサイトではそのように実行していたのでそれを真似た以外の理由はございませんのでフォームからで行います。

function testOnSubmit() {
let form = FormApp.getActiveForm();
var formResponses = form.getResponses();
onSubmit({ response: formResponses[0] });
}
function postMessage(message) {
let CW_ROOM_ID = "ルームID記入";
let CW_TOKEN = "API TOKEN記入";
let POST_TEXT = "相談内容が入力されました：\r\n" + message;
// 送信データ
let params = {
headers: { "X-ChatWorkToken": CW_TOKEN },
method: "post",
payload: {
body: POST_TEXT
}
};
let url = "https://api.chatwork.com/v2/rooms/" + CW_ROOM_ID + "/messages";
UrlFetchApp.fetch(url, params);
}

動作確認のため上のコードで試してみたところ、
【実行】【デバック】と書いてある右にあるプルダウンでpostMessegeを選択し実行をすると実行完了となります。(チャットワークには何もこない)

しかし、testOnSubmitを選択し実行をすると

ReferenceError: onSubmit is not defined
testOnSubmit @ コード.gs:4

という文字が出ます。
フォームで何か回答を送ってもエラーにならなければ何も起こりません。。

[miyaharu]

＞ 以前見ていたサイトではそのように実行していたのでそれを真似た以外の理由はございませんのでフォームからで行います。

了解しました。確かにスプレッドシート上で作成する例は多いですね。

エラーについて

function onSubmit(e) {
let itemResponses = e.response.getItemResponses();
let message = itemResponses[0].getResponse();

postMessage(message);
}

この部分が抜けていませんか？

エラメッセージにも "onSubmit が定義されていません。" (onSubmit is not defined)と書かれています。

最終的には testOnSubmit、onSubmit、postMessageの３つの関数が定義されるはずです。

もう一息だと思うので頑張ってください。

[tyawanmushi2]

教えていただいているにも関わらず期間が空いてしまい申し訳ございません。

【ソースコード】
function testOnSubmit() {
let form = FormApp.getActiveForm();
var formResponses = form.getResponses();
onSubmit({ response: formResponses[0] });
}
function onSubmit(e) {
let itemResponses = e.response.getItemResponses();
let message = itemResponses[0].getResponse();

postMessage(message);
}
function postMessage(message) {
let CW_ROOM_ID = "実際は入力済み";
let CW_TOKEN = "実際は入力済み";
let POST_TEXT = "相談内容が入力されました：\r\n" + message;
// 送信データ
let params = {
headers: { "X-ChatWorkToken": CW_TOKEN },
method: "post",
payload: {
body: POST_TEXT
}
};
let url = "https://api.chatwork.com/v2/rooms/" + CW_ROOM_ID + "/messages";
UrlFetchApp.fetch(url, params);
}

前回お返事いただいた[onSubmit]を入れて書いてみました。
実際にフォームに入力してみましたがチャットワークの送信や、GASの実行数へのエラー表示もありませんでした。

質問なのですがJavaScriptの実行環境を構築しなければ実行できない等ありますでしょうか。
初歩的な質問で申し訳ございません。

[miyaharu]

実行数に何も表示されていないということはトリガーの設定がうまく行っていない可能性があります。
回答に権限の設定についてと、トリガー作成が成功した場合どのような画面になるかのスクリーンショットを追加したのでご確認ください。

[tyawanmushi2]

先程Googleフォームを作り直す所からやり直したところエラーなく無事送信されました。

長い間親身になって教えていただき、大変助かりました。
私も教えられるくらいまで学びます。

本当にありがとうございました！！