Help us understand the problem. What is going on with this article?

超絶簡単!LINE bot開発

超絶簡単!LINE bot開発

by ufoo68
1 / 20

はじめに

この記事は超絶簡単にLINE APIで開発する方法について解説します。@nObisukeさんの記事に影響されて書きました。
環境構築の方法は上記の記事を参考にしてます。流石に丸パクリはしたくないので、サンプルコードに自分なりの修正を加えました。


参考記事との違う点

  1. アクセストークンとシークレットキーを環境変数を用いて呼び出す
  2. 各メッセージごとの処理をswitch文で実装
  3. 全タイプのメッセージを網羅

今回用いる開発ツール


Messaging API


ざっくりとした説明

端的に言うとLINE botが作れるツール。
開発者は専用のLINEアカウントを作ることで思い思いのLINE bot開発が出来る。詳しい内容は@kenakamuさんの記事を読もう。
Botアカウントの登録はここでする。


LINE botの開発(サーバ・クライアント)

  • クライアント
    • サーバにメッセージを送る
    • LINEアプリがその役割を担う
  • サーバ
    • メッセージを受け取りレスポンスを返す
    • 実際に開発するのはこちら側

LINE botの開発(公式SDKに対応する言語)

  • Node.js <- 今回用いるのはこれ
  • Java
  • PHP
  • Python
  • Go
  • Perl
  • Ruby

LINE botの開発(LINEから受け取るメッセージ)


LINE botの開発(サーバ環境の構築)

Firebaseを使うと超絶楽。
プロジェクト開発にはFirebase CLIを使おう。
npm install -g firebase-tools
インストールしたらログインしよう。
firebase login


LINE botの開発(サーバ環境の構築)

プロジェクト用のディレクトリ(フォルダ)を作って
firebase init
と打つとプロジェクト用のファイルを作ってくれる。事前にプロジェクトの作成をサイト上で登録している必要がある。
開発したソースコードはfunctionsのフォルダの中に入る。


LINE botの開発(サーバ環境の構築)

firebase.jsonの設定

firebase.json
{
    "hosting": {
        "public": "./",
        "rewrites": [{
            "source": "/webhook",
            "function": "app"
        }],
        "ignore": [
            "firebase.json",
            "**/.*",
            "**/node_modules/**"
        ]
    }
}

このrewriteの設定が重要になる。


LINE botの開発(サーバ環境の構築)

必要なパッケージをインストールする。
今回はexpressというフレームワークを使います。

cd functions
yarn add @line/bot-sdk express

LINE botの開発(サーバ環境の構築)

/functions/package.jsonの設定

/functions/package.json
{
  "name": "functions",
  "description": "Cloud Functions for Firebase",
  "scripts": {
    "serve": "firebase serve --only functions",
    "shell": "firebase functions:shell",
    "start": "npm run shell",
    "deploy": "firebase deploy --only functions",
    "logs": "firebase functions:log"
  },
  "dependencies": {
    "@line/bot-sdk": "^6.7.0",
    "express": "^4.16.4",
    "firebase-functions": "^2.2.0"
  },
  "private": true,
  "engines": {
    "node": "8"
  }
}

ここは初期設定で問題なし!


LINE botの開発(サーバ環境の実装)

まず必要なキーが二つ

  • Channel Secret
  • アクセストークン(ロングターム)

これらは各チャンネルの基本設定より入手可能


LINE botの開発(サーバ環境の実装)

各キーをFirebaseの機能を使って環境変数として登録する。

firebase functions:config:set channel.secret="your secret key"
firebase functions:config:set channel.accesstoken="your accesstoken"

設定の確認方法は↓

firebase functions:config:get

LINE botの開発(サーバ環境の実装)

練習用コードを用意しときました。

index.js
'use strict';

const functions = require('firebase-functions');
const express = require('express');
const line = require('@line/bot-sdk');
// https://www.npmjs.com/package/line-message-builder
const message = require('line-message-builder');

// channel secretとaccess tokenをFirebaseの環境変数から呼び出す
const config = {
    channelSecret: functions.config().channel.secret,
    channelAccessToken: functions.config().channel.accesstoken
};

const app = express();
//URL + /webhookで登録したWebhook URLが呼び出されたときに実行される。
app.post('/webhook', line.middleware(config), (req, res) => {
    Promise
      .all(req.body.events.map(handleEvent))
      .then((result) => res.json(result));
});

const client = new line.Client(config);
//ユーザから受け取ったイベントについてのハンドリングを実装する
async function handleEvent(event) {
    //ユーザから送られた各メッセージに対する処理を実装する。
    //https://developers.line.biz/ja/reference/messaging-api/#message-event を参照。
    switch (event.message.type) {
        case 'text':
            return client.replyMessage(event.replyToken, message.buildReplyText('テキストを受け取りました。'));

        case 'image':
            return client.replyMessage(event.replyToken, message.buildReplyText('画像を受け取りました。'));

        case 'video':
            return client.replyMessage(event.replyToken, message.buildReplyText('動画を受け取りました。'));

        case 'audio':
            return client.replyMessage(event.replyToken, message.buildReplyText('音声を受け取りました。'));

        case 'file':
            return client.replyMessage(event.replyToken, message.buildReplyText('ファイルを受け取りました。'));

        case 'location':
            return client.replyMessage(event.replyToken, message.buildReplyText('位置情報を受け取りました。'));

        case 'sticker':
            return client.replyMessage(event.replyToken, message.buildReplyText('スタンプを受け取りました。'));
        default:
            return Promise.resolve(null);
    }
}

exports.app = functions.https.onRequest(app);

このコードより、exports.apprewritesfunction/webhookrewritessourceに対応する。


LINE botの開発(サーバへデプロイ)

以下のコマンドで可能

firebase deploy --only functions

Firebaseは無料枠ではサーバ側でリクエストをはじかれてしまうので、有料にする必要があります。オススメは従量課金のBlazeです。


補足

以下のツールを使うとBotのUIをもっと拡張できる

LIFFはMessaging APIとの組み合わせが公式非推奨になってしまった。。。


さいごに

今回はMessaging APIを使ってLINE botを開発する方法について書きました。
他にもLINEプラットフォームではLINE ClovaLINE Thingsとかもサポートしています。
既に各ツールを使った開発の記事は書いていますが。また次回以降にそれぞれの開発方法についても書いていこうと思います。

ufoo68
IoT関係の会社で働いています。学生のときは画像認識を使った研究をしていました。最近はAWSかLINEを使った開発に興味があります。
access
SDNからセンサ、家電、電子書籍まで。ACCESSはあらゆるレイヤのデバイス、サービスを「繋げて」いきます。
http://jp.access-company.com
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした