2021年4月20日

松本

LINEでbotやリッチメニューを設定するお話

プログラミング

facebook
twitter

ここ最近いろいろな意味で話題になっているLINEですが、とはいえ便利なSNSツールであることは間違いないところです。

ここでは情報セキュリティ的な部分は置いといて、LINEのAPIを利用したbotやリッチメニューを作っていきます。

1 事前に行うこと
2 リッチメニューの作成

事前に行うこと

LINE for Business でアカウントを開設する

こちらの方で取得してください

LINE Developers からログインする

https://developers.line.biz からログインします。

チャンネル設定から「新規チャンネル作成」を選び、チャンネルを作成

「LINEログイン」や「Messageing API」などがありますが、今回は「Messaging API」を使います。（「LINEログインはSNSログインみたいな感じですかね）
チャンネル情報はそのままですがアプリタイプは「ウェブアプリ」を選択してください。（アプリで使うならネイティブアプリ）

作成したチャンネルから必要情報をメモ

作成したチャンネルの「チェンネル基本設定」から

チャンネルID
チャンネルシークレット
あなたのユーザーID

「Messaging API設定」から

チャンネルアクセストークン（長期）

をメモしておきます。

Webhookを使ってBotのプログラムを用意する

LINE Officail Account Manager を使ってBotの設定をしてもよいのですが、自社のシステムから投稿管理を行いたいので、今回はWebhookを使って自社サーバーのプログラムを叩いてもらいます。
Webhookについて詳しくはグーグル先生にでも聞いてください。

Webhookのプログラムを用意する

言語は何でもいいですが、PHPでささっと書いておきます。

PHP用のLINE bot SDKですが、こちらもcomposerをつかってささっとインストールできますので、それが入っているという前提です。

    define("LINE_CHANNEL_ID","チャンネルID");
    define("LINE_CHANNEL_SECRET","チャンネルシークレット");
    define("LINE_CHANNEL_ACCESS_TOKEN","アクセストークン");

    define("LINE_SELF_USER_ID", "自分のユーザーID");


    require __DIR__."/assets/vendor/autoload.php";
    $json_string = file_get_contents('php://input');
    $bot = new \LINE\LINEBot(
        new \LINE\LINEBot\HTTPClient\CurlHTTPClient(LINE_CHANNEL_ACCESS_TOKEN),
        ['channelSecret' => LINE_CHANNEL_SECRET]
    );
    $signature1 = $_SERVER["HTTP_".\LINE\LINEBot\Constant\HTTPHeader::LINE_SIGNATURE];

    $channelSecret = LINE_CHANNEL_SECRET; // Channel secret string
    $httpRequestBody = $json_string; // Request body string
    $hash = hash_hmac('sha256', $httpRequestBody, $channelSecret, true);
    $signature = base64_encode($hash);
    $json_object = json_decode($json_string);

    if($signature1 === $signature){
        // OK
    }else{
        // NG
    }

    $type = $json_object->{"events"}[0]->{"type"};

    switch($type){
        case "unfollow":
            unfollow($json_object);
        break;
        case "follow":
            follow($json_object);
        break;
        case "message":
            messages($json_object);            
        break;
    }

    // フォロー
    function follow($json_object){
        $userId = $json_object->{"events"}[0]->{"source"}->{"userId"}; 

        $httpClient = new \LINE\LINEBot\HTTPClient\CurlHTTPClient(LINE_CHANNEL_ACCESS_TOKEN);
        $bot = new \LINE\LINEBot($httpClient, ['channelSecret' => LINE_CHANNEL_SECRET]);            

        $message = "友達追加ありがとう！";

        $textMessageBuilder = new \LINE\LINEBot\MessageBuilder\TextMessageBuilder($message);
        $response = $bot->pushMessage($userId, $textMessageBuilder);

    }

    // フォロー解除
    function unfollow($json_object){
        $userId = $json_object->{"events"}[0]->{"source"}->{"userId"}; 
        // フォロー解除
    }

    // 自動返信処理
    function messages($json_object){
        $userId = $json_object->{"events"}[0]->{"source"}->{"userId"}; 

        $replyToken = $json_object->{"events"}[0]->{"replyToken"};        //返信用トークン
        $message_type = $json_object->{"events"}[0]->{"message"}->{"type"};    //メッセージタイプ
        $message_text = $json_object->{"events"}[0]->{"message"}->{"text"};    //メッセージ内容

        $send_message = $message_text."ってどういうこと？";
        sending_messages($replyToken, $message_type, $send_message);
        
    }

define("LINE_CHANNEL_ID","チャンネルID");

define("LINE_CHANNEL_SECRET","チャンネルシークレット");

define("LINE_CHANNEL_ACCESS_TOKEN","アクセストークン");

define("LINE_SELF_USER_ID", "自分のユーザーID");

require __DIR__."/assets/vendor/autoload.php";

$json_string = file_get_contents('php://input');

$bot = new \LINE\LINEBot(

new \LINE\LINEBot\HTTPClient\CurlHTTPClient(LINE_CHANNEL_ACCESS_TOKEN),

['channelSecret' => LINE_CHANNEL_SECRET]

);

$signature1 = $_SERVER["HTTP_".\LINE\LINEBot\Constant\HTTPHeader::LINE_SIGNATURE];

$channelSecret = LINE_CHANNEL_SECRET; // Channel secret string

$httpRequestBody = $json_string; // Request body string

$hash = hash_hmac('sha256', $httpRequestBody, $channelSecret, true);

$signature = base64_encode($hash);

$json_object = json_decode($json_string);

if($signature1 === $signature){

// OK

}else{

// NG

}

$type = $json_object->{"events"}[0]->{"type"};

switch($type){

case "unfollow":

unfollow($json_object);

break;

case "follow":

follow($json_object);

break;

case "message":

messages($json_object);

break;

}

// フォロー

function follow($json_object){

$userId = $json_object->{"events"}[0]->{"source"}->{"userId"};

$httpClient = new \LINE\LINEBot\HTTPClient\CurlHTTPClient(LINE_CHANNEL_ACCESS_TOKEN);

$bot = new \LINE\LINEBot($httpClient, ['channelSecret' => LINE_CHANNEL_SECRET]);

$message = "友達追加ありがとう！";

$textMessageBuilder = new \LINE\LINEBot\MessageBuilder\TextMessageBuilder($message);

$response = $bot->pushMessage($userId, $textMessageBuilder);

}

// フォロー解除

function unfollow($json_object){

$userId = $json_object->{"events"}[0]->{"source"}->{"userId"};

// フォロー解除

}

// 自動返信処理

function messages($json_object){

$userId = $json_object->{"events"}[0]->{"source"}->{"userId"};

$replyToken = $json_object->{"events"}[0]->{"replyToken"}; //返信用トークン

$message_type = $json_object->{"events"}[0]->{"message"}->{"type"}; //メッセージタイプ

$message_text = $json_object->{"events"}[0]->{"message"}->{"text"}; //メッセージ内容

$send_message = $message_text."ってどういうこと？";

sending_messages($replyToken, $message_type, $send_message);

}

バリデーションチェックや実際の処理はほぼ入っていなくてフォローの時、フォロー解除の時、メッセージが来たときに叩かれる時の挙動を入れてます。

Webhookの設定を行う

LINE Developers のチャンネル「Messageing API設定」から「Webhook設定」のWebhook URLに作成したプログラムのURLを入力して更新してください。

QRコードから実機でアクセスする

「ボット情報」のQRコードをLINEアプリから読み取るとアカウントが表示されて、友達登録を行うとWebhookプログラムで定義していた「友達追加ありがとう！」と表示されます。

これでbotの完成ですね。
メッセージの内容によって返す文言を返せばいい感じのbotが作れます。

リッチメニューの作成

公式アカウントを開くとメニューみたいなのが表示されますが、あれの作り方もまとめます。

東京都民の方はよく見るあれですが、これもAPIを使って作れますが、とりあえずLINE Official Account Managerで作っていきます。

https://manager.line.biz/

ログイン後、「アカウント」からアカウント行ってください。

その後、「ホーム」「トークルーム管理」「リッチメニュー」からトークルームを作りましょう。

表示設定ですが、基本的に管理画面に詳しく書いてあるのでそのまま入力してください。

コンテンツ設定ですが、はじめにメニューのテンプレートを選択します。
これに関してはあらかじめどういうメニューがいいか最初に決めておくのがいいでしょう

テンプレートを選択すると、アクションを設定することができます。

「リンク」はメニューをタップすると設定したリンク先へ遷移され、「クーポン」はあらかじめ設定したクーポンが表示されるようになります。

では「テキスト」ってなにかというとタップすると設定したテキストが利用者から送られてくるだけです。

「ん？意味あるの？」って思うかもしれないですが、前述したbotを駆使するとまるでLINEでやりとりをしているかのような形で案内が可能となります。

上記のプログラムの

// 自動返信処理
 function messages($json_object){ 
	$userId = $json_object->{"events"}[0]->{"source"}->{"userId"}; 
	$replyToken = $json_object->{"events"}[0]->{"replyToken"}; 
	//返信用トークン 
	$message_type = $json_object->{"events"}[0]->{"message"}->{"type"}; 
	//メッセージタイプ
	$message_text = $json_object->{"events"}[0]->{"message"}->{"text"}; 
	//メッセージ内容
	$send_message = $message_text."ってどういうこと？"; 
	sending_messages($replyToken, $message_type, $send_message); 
}

// 自動返信処理

function messages($json_object){

$userId = $json_object->{"events"}[0]->{"source"}->{"userId"};

$replyToken = $json_object->{"events"}[0]->{"replyToken"};

//返信用トークン

$message_type = $json_object->{"events"}[0]->{"message"}->{"type"};

//メッセージタイプ

$message_text = $json_object->{"events"}[0]->{"message"}->{"text"};

//メッセージ内容

$send_message = $message_text."ってどういうこと？";

sending_messages($replyToken, $message_type, $send_message);

}

の部分が呼び出されるので、ここに処理をつければいい感じですね。

先ほどの「リンク」だと直接リンク先へ遷移されますが、「テキスト」と「bot」を使うと、LINEアカウントからリンク先を案内すると言った形になるので、コンテンツ次第ではありじゃないでしょうか

執筆者：松本[ エンジニア ]

プログラミング

SharePointではできないこと 4選

「これってSharePointでできないの!?」なんていう瞬間、開発やカスタマイズの現場では意外と多くあります。SharePointはとても柔軟なプラットフォームですが、実は“万能ツール”ではありません。「コードを書けば何とかなる」と思って構築を進めると、モダンページの仕様や制限に阻まれて苦い思いをすることもしばしば。今回は、実際のプロジェクトや運用の中で見えてきた「SharePointではできないこと」をまとめて紹介します。目次1 1.CSSとJSが直接使えない1.1 ク […]

2025年10月10日

Webサイト制作

WordPress納品後にクライアントが安心して運用できる仕組みづくりをしよう

ホームページ制作において、更新機能を手軽に導入できるのがWordPressです。専門知識がなくても記事の投稿やページ編集を行いやすい一方で、クライアントが自分で運用するには、が欠かせません。今回は、そのための仕組みづくりについてご紹介します。制作側の方はもちろん、クライアント側でホームページ運用を担当される方も、制作時のご相談などにぜひ参考にしてみてください。目次1 管理画面のロゴを企業ロゴに変更する2 管理画面のURLを変更する・認証などを付けてセキュリティ面を強化 […]

2025年10月3日

Webデザイン

アプリのロゴアニメーションをAfter Effectsで作成→Lottieに変換【iOS/Android対応】

こちらは、当社でリリースしたアプリ「ピンピタ」で使用しているロゴアニメーションです。スプラッシュ画面でロゴが動くと、ぐっとアプリらしい印象になりますし、作ってみたいですよね。今回は、After Effects（以降AE）でロゴアニメーションを作成し、アプリに組み込むまでをご紹介します。 AEと聞くと難しい印象がありますが、PremiereやFlashなどを触った経験がある方なら、すぐに慣れます。もう一度再生目次1 作業フロー1.1 注意点：グラデーションが使用不可2 […]

2025年9月19日

株式会社8bit (エイトビット)

東京都目黒区でWebサイト制作、Webシステム開発などを行っております。
コーポレートサイトやWebサービスの企画・提案を得意としており、自社での経験を元にアイデアをカタチにするお手伝いをさせていただいております。

Web制作に関するご相談はお気軽にどうぞ

弊社に制作をご依頼いただく際の費用感をご確認いただける、
見積りシミュレーションをご用意いたしました。

Web制作、Webサービスに関する技術やノウハウを発信するコラムサイト

LINEでbotやリッチメニューを設定するお話

事前に行うこと

LINE for Business でアカウントを開設する

LINE Developers からログインする

チャンネル設定から「新規チャンネル作成」を選び、チャンネルを作成

作成したチャンネルから必要情報をメモ

Webhookを使ってBotのプログラムを用意する

Webhookのプログラムを用意する

Webhookの設定を行う

QRコードから実機でアクセスする

リッチメニューの作成

関連記事

SharePointではできないこと 4選

WordPress納品後にクライアントが安心して運用できる仕組みづくりをしよう

アプリのロゴアニメーションをAfter Effectsで作成→Lottieに変換【iOS/Android対応】