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アカウントからリンク先を案内すると言った形になるので、コンテンツ次第ではありじゃないでしょうか

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

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

事前に行うこと

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

LINE Developers からログインする

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

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

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

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

Webhookの設定を行う

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

リッチメニューの作成

関連記事

【phpdotenv】PHPで環境変数を取り扱うお話

【CAPTCHA系】reCAPTCHAの代替サービスを紹介するお話

Webアクセシビリティの基本を学ぼう！