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 REST APIを使用してリストの情報を取得し、headerにナビを作る

SharePointで作成したリストの情報をREST APIを使用して取得してみましょう。今回は、APIで取得した情報を、headerにリンクとして差し込んでみます。サイト全体共通のナビでも、リストを使用すると、一か所で管理できるので便利です。目次1 前提条件2 1.REST APIで情報を取得2.1 REST APIのURL2.2 データを取得する処理3 2.取得した情報をheaderに表示前提条件 SharePoint Online モダンUI カスタムJSが使用で […]

2025年3月26日

WordPress

WordPressで権限やユーザーごとに管理画面のサイドメニュー表示を切り分ける

デフォルトだといろいろな項目が表示されているWordPressの管理画面のサイドメニュー。慣れていない人にはわかりづらいですよね。また、権限によってデフォルトで非表示にしてくれたりもしますが、この部分は見せたくないな…ということも多いと思います。今回はWordPressで権限やユーザーごとにサイドメニューの表示を変更する方法をご紹介します。目次1 権限の種類について2 function.phpに記述する2.1 サイドメニューの非表示用のコード2.2 権限ごとに振り分け […]

2025年3月26日

プログラミング

jQuery+PHPで大容量ファイルを分割アップロードするお話

ファイルのアップロードを行う際に注意しないといけないのが「アップロード容量」と「タイムアウト」です。どちらもサーバーの設定に関わるところでレンタルサーバーでは対処しきれないところもあり、大容量にするとそれだけアップロードに時間がかかりタイムアウトが発生しやすくなります。そこでフロント側で分割してファイルをアップし、バックエンド側で受け取った後に結合するようにするとよいでしょう注意すべき点として通常のPOSTでの送信ではないため、あらかじめそこら辺を考慮した処理が必要とな […]

2025年2月20日

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

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

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

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

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

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

事前に行うこと

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

LINE Developers からログインする

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

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

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

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

Webhookの設定を行う

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

リッチメニューの作成

関連記事

SharePoint REST APIを使用してリストの情報を取得し、headerにナビを作る

WordPressで権限やユーザーごとに管理画面のサイドメニュー表示を切り分ける

jQuery+PHPで大容量ファイルを分割アップロードするお話