1. ホーム
  2. /
  3. [LINE BOT]
  4. /
  5. 【GAS】LINE Messaging APIで画像カルーセルメッセージを送信する方法

【GAS】LINE Messaging APIで画像カルーセルメッセージを送信する方法

【GAS】LINE Messaging APIで画像カルーセルメッセージを送信する方法

この記事では、Google Apps Script (GAS) を利用して、LINE BOTで「画像カルーセルテンプレートメッセージ」を送信する方法を解説します。

画像カルーセルは、複数の画像を横にスクロールできる形式で表示し、それぞれにアクションを割り当てることができるメッセージタイプです。商品紹介や選択肢の提示など、視覚的でインタラクティブな表現が可能になります。

公式ドキュメントはこちらを参照してください。

Google Apps Script 始め方 スプレッドシート 活用例
Google Apps Script 始め方 スプレッドシート 活用例 を各ショップで検索
LINE BOT チャットボット 作り方
LINE BOT チャットボット 作り方 を各ショップで検索

事前準備

実装を始める前に、以下の準備が必要です。

  1. チャンネルアクセストークンの取得: LINE Developersコンソールから、利用するBOTのチャンネルアクセストークンを取得してください。
【初心者向け】LINE Messaging APIのアクセストークンを取得する方法を解説
【初心者向け】LINE Messaging APIのアクセストークンを取得する方法を解説

LINE BOT開発に不可欠なMessaging APIのチャンネルアクセストークンを取得する手順を、実際の画面キャリプチャを交えて詳しく解説します。LINE Developersへの登録からプロバイダー、チャンネル作成、トークン発行までを網羅。

  1. ユーザーIDの取得: メッセージの送信先となるご自身のLINEユーザーIDを取得してください。
【GAS】LINE BOTでユーザーIDを取得する方法|Webhookで情報を受け取る
【GAS】LINE BOTでユーザーIDを取得する方法|Webhookで情報を受け取る

Google Apps Script(GAS)を使って、LINE BOTと友だちになっているユーザーのIDを取得する方法を解説します。Webhook経由で送信されるイベント情報から、特定のユーザーを識別するための`userId`を抜き出すサンプルコードを紹介します。

実装コード

それでは、GASで画像カルーセルメッセージを送信するコードを見ていきましょう。

1. 定数の設定

まず、スクリプトで利用する定数を定義します。取得したチャンネルアクセストークンとユーザーIDを設定してください。

const TOKEN = 'LINEのトークンを指定(取得方法:https://arukayies.com/gas/line_bot/gettoken)';
const DEBUGID = 'LINEのユーザIDを指定(取得方法:https://arukayies.com/gas/line_bot/get-userid)';

2. 画像カルーセルメッセージを送信するコード

以下の関数は、指定したユーザーに画像カルーセルメッセージを送信します。

// LINE BOTで画像カルーセルメッセージを送信するサンプル
function pushImageCarousel() {
  const url = 'https://api.line.me/v2/bot/message/push';
  const headers = {
    'Content-Type': 'application/json',
    'Authorization': 'Bearer ' + TOKEN,
  };

  const payload = {
    'to': DEBUGID,
    'messages': [
      {
        'type': 'template',
        'altText': '画像カルーセルメッセージ',
        'template': {
          'type': 'image_carousel',
          'columns': [
            {
              'imageUrl': 'https://placehold.jp/1024x1024.jpg?text=Image1',
              'action': {
                'type': 'message',
                'label': 'メッセージ1',
                'text': '画像1が選択されました'
              }
            },
            {
              'imageUrl': 'https://placehold.jp/1024x1024.jpg?text=Image2',
              'action': {
                'type': 'uri',
                'label': '詳細を見る',
                'uri': 'https://arukayies.com'
              }
            },
            {
              'imageUrl': 'https://placehold.jp/1024x1024.jpg?text=Image3',
              'action': {
                'type': 'postback',
                'label': 'ポストバック',
                'data': 'action=select&item=3'
              }
            }
          ]
        }
      }
    ],
    'notificationDisabled': false
  };

  const options = {
    'method': 'POST',
    'headers': headers,
    'payload': JSON.stringify(payload)
  };

  UrlFetchApp.fetch(url, options);
}

このコードでは、templateオブジェクトのtypeimage_carouselを指定し、columns配列に表示したい画像の数だけオブジェクトを追加します。各カラムにはimageUrl(画像のURL)と、タップされたときのアクションをactionオブジェクトで定義します。1つのカラムには1つのアクションのみ設定可能です。

動作確認

GASのスクリプトエディタでpushImageCarousel関数を実行すると、LINEに画像カルーセルメッセージが送信されます。

画像にはそれぞれ異なるアクション(メッセージ送信、URIを開く、ポストバック)が設定されています。

アクションオブジェクトの種類については、以下の記事で詳しく解説しています。

【LINE BOT】GASで使える7種類のアクションオブジェクトまとめと比較
【LINE BOT】GASで使える7種類のアクションオブジェクトまとめと比較

LINE BOT開発で必須のアクションオブジェクト7種類(ポストバック、メッセージ、URI、日時選択、カメラ、カメラロール、位置情報)の機能と使い方をGoogle Apps Script (GAS) のサンプルを交えて徹底解説。それぞれの違いや最適な使い分けがわかります。

まとめ

今回は、GASを使ってLINE BOTで画像カルーセルメッセージを送信する方法を解説しました。この機能を使えば、よりリッチでインタラクティブなユーザー体験を提供できますので、ぜひ活用してみてください。

Google Apps Script 始め方 スプレッドシート 活用例
Google Apps Script 始め方 スプレッドシート 活用例 を各ショップで検索
LINE BOT チャットボット 作り方
LINE BOT チャットボット 作り方 を各ショップで検索

関連記事

【GAS】LINE Messaging APIでクイックリプライメッセージを送信する方法

【GAS】LINE Messaging APIでクイックリプライメッセージを送信する方法

この記事では、Google Apps Script (GAS) を利用して、LINE BOTで「クイックリプライ」メッセージを送信する方法を初心者向けに分かりやすく解説します。

クイックリプライは、ユーザーがメッセージに対して簡単なボタン操作で返信できるようにする機能です。これにより、ユーザー体験を向上させることができます。

公式ドキュメントはこちらです。

Google Apps Script 始め方 スプレッドシート 活用例
Google Apps Script 始め方 スプレッドシート 活用例 を各ショップで検索
LINE BOT チャットボット 作り方
LINE BOT チャットボット 作り方 を各ショップで検索

【GAS】LINE Messaging APIでカルーセルテンプレートメッセージを送信する方法

【GAS】LINE Messaging APIでカルーセルテンプレートメッセージを送信する方法

この記事では、Google Apps Script (GAS) を利用して、LINE BOTで「カルーセルテンプレートメッセージ」を送信する方法を解説します。

カルーセルテンプレートは、複数のアイテム(カラム)をカードのように横に並べて表示できるメッセージ形式です。各カードには画像、タイトル、説明文、複数のアクションボタンを設定でき、商品リストやレストランのメニュー紹介など、豊富な情報をインタラクティブに見せたい場合に非常に有効です。

公式ドキュメントはこちらを参照してください。