🦄

【LINE Messaging API × GAS】なんでもギャルにしてくれるbotを作った💖🌈🦄💖

2023/02/23に公開

はじめに

この記事は、LINE Messaging APIとGAS(Google Apps Script)を使って、なんでもギャルにしてくれるbotを作ったときのことをまとめた記事です。
LINE Messaging APIには大きく分けて2種類の送信方法(リプライとプッシュ)がありますが、今回はリプライ型のbotを作っていきたいと思います。

👇 プッシュ型のbotを作ったときの記事はコチラ
https://zenn.dev/miya_akari/articles/a8a4c296e7c1c6
👇 LINE Notify × GASの記事はこちら
https://zenn.dev/miya_akari/articles/e4541d7ac84921

今回やりたいこと

  • 自分が送ったメッセージにギャルっぽい絵文字を追加して送り返してくれるbotを作る(オウム返しbotの応用です)

👇 オウム返しbotの参考
https://qiita.com/tetrapod117/items/e7b48485c98f6b88f311
https://qiita.com/cog1t0/items/f6e832d54a7b0e692434
https://zenn.dev/miito/articles/f4fc29f92a45aa

ギャルbotを作る手順

  1. LINE Developerコンソールでチャネルを作る
  2. 作ったチャネルを友達登録する
  3. チャネルのアクセストークンを取得する
  4. プッシュメッセージ用のコードをGASに記述する
  5. デプロイ
  6. Webhookの設定
  7. 自動応答設定の変更

今回は4から解説していきます。

1~3は前回書いた記事を参考にしてください 👇

https://zenn.dev/miya_akari/articles/a8a4c296e7c1c6#理想の彼女botを作る手順

  • チャネルアイコン、チャネル名、チャネル説明は以下のように設定します。
    LINEbot設定
    ・チャネルアイコン:「いらすとや」さんを使用させていただきます
    ・チャネル名:ギャルしか勝たん!!!
    ・チャネル説明:なんでも「アゲ〜!!」な文章にするよ!!!

4. プッシュメッセージ用のコードをGASに記述する

  1. Googleドライブにログインし、新規のGASを作成
    新規GAS作成
  2. 以下のコードを記述する
  • accessTokenには、Messaging API設定の項目からコピーしたチャネルのトークンを貼り付けてください
コード.gs
const url = 'https://api.line.me/v2/bot/message/reply'; //リプライ用APIのURL(末尾がreply)
const accessToken = 'コピーしたチャネルトークンを貼り付け';

function doPost(e) {
  // 送られてきたデータをjsonに変換
  const event = JSON.parse(e.postData.contents).events[0];
  // 応答トークンを取得
  const replyToken = event.replyToken;
  // ユーザーからのメッセージ
  const userMessage = event.message.text;
  // メッセージ以外(スタンプや画像)が届いたとき
  if (!userMessage) {
    userMessage = "アゲ〜";
  }
  // 語尾をセット
  const suffix = [
    "💖💖💖💖💖💖💖💖💖💖💖💖💖",
    "😆😆😆✨✨✨✨⤴︎⤴︎⤴︎⤴︎",
    "✨✨✨🌈🌈🌈🌈🌈💗💗💗💗💗",
    "🦄🦄🦄🌈🌈🌈💗💗💗💗💗💗",
    "✌️✌️✌️✌️🌈🌈🌈💗💗💗💗💗",
    "😍😍😍😍😍❤️❤️❤️❤️⤴︎⤴︎⤴︎⤴︎",
    "😆😆😆❗️❗️❗️❗️💖💖💖💖💖"
  ]
  // ランダムに選ぶ
  const index = Math.floor(Math.random()*suffix.length);

  // メッセージ送信設定
  UrlFetchApp.fetch(url, {
    'headers': {
      'Content-Type': 'application/json; charset=UTF-8',
      'Authorization': 'Bearer ' + accessToken,
    },
    'method': 'post',
    'payload': JSON.stringify({
      'replyToken': replyToken, // 応答トークン
      'messages': [{
        'type': 'text',
        'text': userMessage + suffix[index], // ユーザーが送ってきたメッセージに語尾を足す
      }]
    })
  });
  return ContentService.createTextOutput(JSON.stringify({'content': 'post ok'})).setMimeType(ContentService.MimeType.JSON);
}

ここがポイント!

suffixにブチ上がる絵文字をセットします❗️❗️❗️😆💗💗

// 語尾をセット
  const suffix = [
    "💖💖💖💖💖💖💖💖💖💖💖💖💖",
    "😆😆😆✨✨✨✨⤴︎⤴︎⤴︎⤴︎",
    "✨✨✨🌈🌈🌈🌈🌈💗💗💗💗💗",
    "🦄🦄🦄🌈🌈🌈💗💗💗💗💗💗",
    "✌️✌️✌️✌️🌈🌈🌈💗💗💗💗💗",
    "😍😍😍😍😍❤️❤️❤️❤️⤴︎⤴︎⤴︎⤴︎",
    "😆😆😆❗️❗️❗️❗️💖💖💖💖💖"
  ]

自分だけじゃギャルっぽくなるか不安だったので、エルフの荒川さんや選挙ギャルズさんのアカウントの投稿を参考にしました💖😆🦄🌈💖

5. デプロイ

作成したGASとLINEbotを連携させるURLを発行するため、デプロイします。

  1. [デプロイ] > [新しいデプロイ]をクリックする
    デプロイ1
  2. [歯車マーク] > [ウェブアプリ]をクリックする
    デプロイ2
  3. [アクセスできるユーザー]を[全員]に変更する
    デプロイ3
  4. URLが発行されるのでコピーする 👇
    デプロイ4

6. Webhookの設定

LINE Developersに戻って先ほどコピーしたURLを貼り付けます。

  1. Messaging API設定 > [Webhook設定] > [編集] > URLを貼り付ける
  2. [Webhookの利用]をオンにする
    Webhook設定

7. 自動応答設定変更

最後に自動応答をオフにしたら完成です!!

  1. 応答メッセージ > [編集]
    応答メッセージ設定1
  2. [Webhook]をオン、[応答メッセージ]をオフにする
    応答メッセージ設定2
    これで、ギャルbotができました〜!😍😍😍❤️❤️❤️⤴︎⤴︎⤴︎⤴

メッセージを送ってみる

完成したので、メッセージを送ってみます!
LINE画面1
やったー!!🥳💖💖💖🌈
ネガティブなメッセージを送っても、アゲ〜⤴︎⤴︎⤴︎✨✨✨😆にしてくれます!
LINE画面2

おわりに

アカウント作成〜メッセージを送るまで、30分くらいでできました!
せっかくなので、友達追加時の背景をCanvaで作ってみたよ〜!🦄🦄🌈🌈💗💗💗
LINE友達追加画面
よかったら友達追加して、メッセージを送ってみてください❗️❗️❗️😆(送られたメッセージはこちらから確認できません〜)
LIENQRコード
Twitterもよかったらフォローしてね!👇😊💖💖💖
https://twitter.com/akari_myuc

参考

https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Math/random
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Math/floor

Discussion