入会システム技術マニュアル

NOTE

このマニュアルは Qiitaに投稿した記事の再掲です。

経緯

前提

私の所属する「東京都市大学デジタルコンテンツ研究会」ではサークル活動にDiscordを使用している
一年の入会者数は約80人
大学の規則で東京都市大学に所属する学生のみ入会可能
入会希望者には、（勧誘期間を除き）HPや𝕏から問い合わせを送ってもらい個別にやりとり

問題点

入会希望者が多いので個別に対応すると返信が大変。問い合わせを見逃す可能性もある
勧誘期間は直接Discordに参加した後、Googleフォームで学籍番号・本名などの情報を入力してもらっていたが、入力忘れによる取りこぼしがあった

以上のような状態であったため、デジタルコンテンツ研究会ではサークル入会とDiscord招待リンクの送付を自動化することにしました。

必要な機能

東京都市大学の学生であることの確認
大学への提出に必要な学籍番号、学部学科、本名の収集
Disocrdサーバーへの招待リンクの送付
- なお招待リンクは外部への流出を避けるため固定ではなくユーザごとにランダムが望ましい
サークル運営者への新規入会者通知

使用する技術

なんと無料です。

Googleフォーム
Google Apps Script
Discord API
Cloudflare Workers（プロキシ用）

フロー

フロー.png

学籍番号メール宛にDiscord招待リンクを送付することで、学生本人であることの確認をします。フロントエンド・バックエンドと記載するのが正しいのか分かりませんが、大体伝わりますでしょうか。

実装

Googleフォーム作成

以下を必須項目として入会希望者に入力してもらいます。

学籍番号メール
氏名
Discordアカウント名
学部
学科

学籍番号メール以外の入力ができないようバリデーションをかけます。（余談ですが、フォームの運用当初は末尾に「～で終わる」を意味する $ がなかったため、 @tcu.ac.jp.example.com がすり抜ける危険な状態になっていました）

Google Apps Script

Googleフォーム編集画面からスクリプトエディタを開きます。

編集画面が現れるので、実装していきます。

機能ごとに以下の4つにファイルを分割しています。

環境変数.gs
メール自動返信.gs
Discord通知.gs
Discord招待コード自動発行.gs

環境変数.gs

/* 【設定】 Discord招待コード（招待コード自動発行に失敗した場合に使用するため、有効期限が無制限のものを設定） */
/* 'https://discord.gg/JqHTZW5JRm'であれば、'JqHTZW5JRm'の部分のみを入力 */
const DISCORD_INVITE_CODE = 'XXXXXXXXXX';

/* 【設定】 DiscordのウェブフックURL */
const WEB_HOOK_URL = 'https://discord.com/api/webhooks/00000000000000000000/XXXXXXXXXXXXXXXXXXXX';

/* 【設定】 Discord BOT APIキー */
const DISCORD_BOT_API_KEY = 'XXXXXXXXXXXXXXXXXXXX.XXXXX.XXXXXXXXXX';

/* 【設定】 Discord API URL */
/* 現在は Google Apps Script から直接 Discord API を使用できないため、 Cloudflare Workers でプロキシをおこなっている */
const DISCORD_API_URL = 'https://example.example.workers.dev/invites';

補足

DiscordのウェブフックURL

Discordのチャンネルに投稿するための設定です。ウェブフックURLはチャンネルの設定から発行することができます。

このウェブフックURLに情報を送ると、以下のようにウェブフックからチャンネルへ投稿が可能になります。

Discord API URL

GAS から直接 Discord API にアクセスできないため（※原因は後述）、何かしらの方法で API の通信を中継してください。

メール自動返信.gs

入会フォームに記載された学籍番号メールへDiscordサーバーへの招待リンクを送信します。


async function sendMailOnSubmit(e){
  let message = '';
  let usermail;
  let username;

  let itemResponses;
  try {
    itemResponses = e.response.getItemResponses();
  } catch(e) {
    notifyDiscordWhenSendEmailError(e, usermail, username);
  }

  // 招待コード発行（失敗した場合は無期限の招待コードを設定）
  let discordInviteCode;
  try {
    discordInviteCode = await fetchInviteCode();
  } catch(e) {
    discordInviteCode = DISCORD_INVITE_CODE;
  }

  for (let i = 0; i < itemResponses.length; i++) {
    let itemResponse = itemResponses[i];
    let question = itemResponse.getItem().getTitle();
    let answer = itemResponse.getResponse();

    // Googleフォーム項目のタイトルと合わせる必要あり
    if (question == 'メールアドレス'){
      usermail = answer;
    }
    if (question == '氏名'){
      username = answer;
    }

    message += question + '：' + answer + '\n';
  }

  /* ユーザー宛メール送信設定 */
  // 件名・文面の設定
  const title = '件名';
  const content = `${username} 様

${message}
【Discordサーバー招待リンク】
https://discord.gg/${discordInviteCode}
招待コード: ${discordInviteCode}

文面はサンプルです。`;

  const options = {from: 'XXXXXX@gmail.com', name: 'デジタルコンテンツ研究会', replyTo: 'XXXXXX@example.com'};

  // 送信
  try {
    GmailApp.sendEmail(usermail, title, content, options);
  } catch(e) {
    notifyDiscordWhenSendEmailError(e, usermail, username);
  }
}

Discord通知.gs

入会フォームが送信された際にDiscordへ通知を送信します。エラー時の通知も行っています。


function notifyDiscordOnSubmit(e) {
  let itemResponses;
  try {
    itemResponses = e.response.getItemResponses();
  } catch(e) {
    notifyDiscordWhenWebhookError(e);
  }

  // Discordに表示する文章
  let messageBody;

  messageBody = '--------------------\n';

  // 学籍番号表示（メアドから数字のみ抽出）
  messageBody += '学籍番号：g' + itemResponses[0].getResponse().replace(/[^0-9]/g, '') + '\n';

  for (let i = 1; i < itemResponses.length; i++) {
    let itemResponse = itemResponses[i];
    let question = itemResponse.getItem().getTitle();
    let answer = itemResponse.getResponse();

    messageBody += question + '：' + answer + '\n';
  }

  const message = {
    'content': messageBody, 
    'tts': false,
  }

  const param = {
    'method': 'POST',
    'headers': { 'Content-type': 'application/json' },
    'payload': JSON.stringify(message)
  }

  // 送信
  try {
    UrlFetchApp.fetch(WEB_HOOK_URL, param);
  } catch(e) {
    notifyDiscordWhenWebhookError(e);
  }
}

function notifyDiscordWhenSendEmailError(error, usermail, username) {
  // Discordに表示する文章
  let messageBody = `--------------------
@everyone
# !!!【要対応】メール送信エラー!!!
入会メールを送信する際にエラーが発生しました。
入会者にDiscordサーバーへの招待リンクが通知されていません。
手動でDiscordサーバへの招待リンクを記載したメールを送信してください。
### 該当会員
- メールアドレス：\`${usermail}\`
- 氏名：\`${username}\`
※上記が\`undefined\`や空の場合、このメッセージの送信時刻とGoogleフォームの受付時刻を照らし合わせる、Gmail（\`tcu.dcs@gmail.com\`）の送信済メールを確認するなどして特定をお願いします。
### エラー内容
\`${error}\`
`;

  const message = {
    'content': messageBody, 
    'tts': false,
  }

  const param = {
    'method': 'POST',
    'headers': { 'Content-type': 'application/json' },
    'payload': JSON.stringify(message)
  }

  // 送信
  try {
    UrlFetchApp.fetch(WEB_HOOK_URL, param);
  } catch(e) {
    notifyDiscordWhenWebhookError(e);
  }
}

function notifyDiscordWhenWebhookError(error) {
  // Discordに表示する文章
  let messageBody = `--------------------
Discord通知の過程でエラーが発生しました。
### エラー内容
\`${error}\``;

  const message = {
    'content': messageBody, 
    'tts': false,
  }

  const param = {
    'method': 'POST',
    'headers': { 'Content-type': 'application/json' },
    'payload': JSON.stringify(message)
  }

  UrlFetchApp.fetch(WEB_HOOK_URL, param);
}

Discord招待コード自動発行.gs

そのままでは GAS から Discord API へのアクセスできないため、Cloudflare Workers でプロキシしています。そのため、Discord API のエンドポイントを環境変数で設定した場合にはエラーが起こります。 let data = JSON.stringify({"max_age": 604800,"max_uses": 1,"unique": true}); の部分で有効期限7日、利用回数1回に制限しています。

function fetchInviteCode() {
  let url = DISCORD_API_URL;
  let headers = {
    'Authorization': 'Bot ' + DISCORD_BOT_API_KEY,
    'Content-Type': 'application/json',
  };
  let data = JSON.stringify({"max_age": 604800,"max_uses": 1,"unique": true});
  let options = {
     'method' : 'post',
     'payload' : data,
     'headers' : headers,
     'muteHttpExceptions': true
  };
  // 招待コード取得
  let response = UrlFetchApp.fetch(url, options);
  // レスポンスが200以外の場合はエラーを返却
  if (response.getResponseCode() !== 200) {
    throw new Error();
  }
  let json = JSON.parse(response.getContentText());
  return json.code
}

GASのトリガーを設定

実行する関数を選択し、イベントの種類を選択をフォーム送信時に設定します。

今回は以下の二つの関数をフォーム送信時に実行します。

sendMailOnSubmit
notifyDiscordOnSubmit

つまづいたところ

問題： GAS から Discord API へのアクセス不可能

APIにアクセスしてDiscordサーバーの招待リンク発行を行いたいのですが、Google Apps Script から直接 Discord API へのアクセスはできないようです。以下の記事の方が原因を分析してくださっていますが、Discord API の利用時に適切な User Agent を設定する必要があるが、GAS では User Agent の設定ができません。

https://qiita.com/Chrysanthemum94/items/25ffa5683beda15d4917

対処方法: Cloudflare Workers で通信を中継

下記のサイトのコードを参考にしています。

https://balloon-jp.vercel.app/cloudflare-workers/

とりあえず動けばいいやの精神で書いたので非常に雑です。 Discord API のドキュメントに従い、User-Agentを適切な値に書き換えて Discord API にアクセス→結果を返却しています。

const proxyMAP = new Map([
  ["/invites", "https://discordapp.com/api/channels/XXXXXXXXXXXXXXXXXX/invites"],
])

async function handleRequest(request) {

  let newHeader = new Headers(request.headers)
  newHeader.set("User-Agent", "$User-Agent: DiscordBot (xxxxxxxx, 0)")

  const requestURL = new URL(request.url)
  const location = proxyMAP.get(requestURL.pathname)
  const search = requestURL.search

  if (location) {
    return await fetch(location + search, {
      method: request.method,
      body: request.body,
      headers: newHeader
    })
  }

  return new Response("Not Found", {
    headers: { "content-type": "text/plain" },
    status: 404
  })
}

addEventListener("fetch", event => {
  event.respondWith(handleRequest(event.request))
})

入会システム技術マニュアル

経緯

前提

問題点

必要な機能

使用する技術

フロー

実装

Googleフォーム作成

Google Apps Script

環境変数.gs

補足

DiscordのウェブフックURL

Discord API URL

メール自動返信.gs

Discord通知.gs

Discord招待コード自動発行.gs

GASのトリガーを設定

つまづいたところ

問題： GAS から Discord API へのアクセス不可能

対処方法: Cloudflare Workers で通信を中継

完成

新規入会者への招待リンク送付

管理者向け通知

Contact

入会システム技術マニュアル ​

経緯 ​

前提 ​

問題点 ​

必要な機能 ​

使用する技術 ​

フロー ​

実装 ​

Googleフォーム作成 ​

Google Apps Script ​

環境変数.gs ​

補足 ​

DiscordのウェブフックURL ​

Discord API URL ​

メール自動返信.gs ​

Discord通知.gs ​

Discord招待コード自動発行.gs ​

GASのトリガーを設定 ​

つまづいたところ ​

問題： GAS から Discord API へのアクセス不可能 ​

対処方法: Cloudflare Workers で通信を中継 ​

完成 ​

新規入会者への招待リンク送付 ​

管理者向け通知 ​

Contact ​

入会システム技術マニュアル

経緯

前提

問題点

必要な機能

使用する技術

フロー

実装

Googleフォーム作成

Google Apps Script

環境変数.gs

補足

DiscordのウェブフックURL

Discord API URL

メール自動返信.gs

Discord通知.gs

Discord招待コード自動発行.gs

GASのトリガーを設定

つまづいたところ

問題： GAS から Discord API へのアクセス不可能

対処方法: Cloudflare Workers で通信を中継

完成

新規入会者への招待リンク送付

管理者向け通知

Contact