【エンジニアじゃなくてもできる】一切お金をかけずにブラウザ上で10分でLINE BOTを作る方法

シェアする

LINE Bot Trial Apiが開放されて、Bot作ってみた系を沢山見かけるようになりましたが、「1万人限定らしいからアカウントとってみたけど、BOTの作り方とかよくわかんない」という方も結構いるんじゃないでしょうか。

LINE BOTを動かすには、プログラムを書く必要があるのは勿論のことながら、

  • サーバーを用意しなきゃだったり、
  • SSL証明書を用意しなきゃだったり、
  • 固定IPを用意しなきゃいけなかったり

等々色々やることがあり、この辺の知識がない状態で必要な環境を自分で用意するとなると結構骨が折れます。(とはいっても調べながらやればなんとななるとは思いますが!)

色々調べてみたところ、技術的な前提知識がなくてもとりあえずLINE BOTで遊べる方法があったので、まとめてみました。


Botに関する情報共有用のFacebookグループを作ってみました。
記事の内容についてやBotについての質問があれば、ここに書いていただければ分かる範囲でお答えするので、興味がある方は是非入って下さい!

こちらです
↓↓↓

Bot Developers


この記事で目指すゴール

プログラミング未経験/初心者の方でも、お金をかけずに最短距離でとりあえず動くLINE BOTを作って遊ぶことをゴールとして記事を書きました。

こんな風に、ある文字列を送信したら、予め決めておいた返事が返ってくるようなBotを作ります。
enter image description here
(本当はアイドルの画像とかにするとだいぶテンションが上がるのですが、肖像権的なアレがあるので一応フリー素材のロボットにしました笑)

利用するサービスの都合上、マイナーな言語を使うので正直ベストな方法ではありませんが、難しいことをしなくてもこの通りやればLINE BOTをすぐに作れるよくらいに考えていただければと思います。

※ 無料サービスを使うので、7日間しか動かないです (作りなおせばまた7日間使えます)
※ 作業自体は10分程度でできますが、LINEに諸々の設定が反映されるのに時間がかかる場合があるので、実際にBotが動くまではもっと時間がかかる可能性があります。
※ エンジニアじゃなくても分かるとかいたものの、多少はITの前提知識がないと厳しいかもしれないです...笑

LINE Trial Botでできること

この記事を見ておけば、LINE Trial Botでできることを一通り把握できると思います。今回はこの辺を読まなくても作れますが、時間があるときにでも読んでみてください。

LINE BOT API Trialでできる全ての事を試してみた - Qiita

公式ドキュメント (英語)

LINE Developers - BOT API - Overview

作り方

それでは作り方について順を追って説明していきます。

LINE developerに登録

LINE BUSINESS CENTER

こちらのページにアクセスしてLINE developerアカウントを作ります。

こちらでスクリーンショット付きで詳しく解説されていますのでアカウント作成の流れはこちらの記事をご覧ください。

【LINE BOT】 アカウント設定の仕方 〜アカウントを取ってみた!〜 - Qiita

WebScriptに登録

LINE BOTを動かすには、BotのAPIを用意する必要があります。
普通にやろうとすると自分でサーバーを立てたり環境構築をしたりSSL証明書を取得したりと面倒なので、今回はWebScriptというサービスを使います。
webscript - scripting on the web

Lua言語というあまり使われない言語ですが、基本的な書き方については他の言語と大して変わりません。

WebScriptはこちらの記事で知りました
(コードもかなり參考にさせていただいてます...)
webscript.ioでLINE BOT APIの事始め - No Regret No Life

まず、webscriptにアクセスしてください。

webscript - scripting on the web

enter image description here
右上のlogin/signupをクリック
enter image description here
sign up for free を押します。
enter image description here
メールアドレスとパスワードを入力して Sign Upをクリック
enter image description here
これでwebscriptにアカウント登録がされました。右上のLogin/Signupを押してログインに進みます。
(正しく入力しててもこんな風にエラーがでてしまうことがあるのですが、気にせずログインできるか試してみてください。)
enter image description here
enter image description here

実装

それでは実装に入っていきます。 `
enter image description here
利用規約を承諾するとこの画面になると思うので(なってなかったらScriptと書いてある上部のタブを押してください)、左側にある "Create New Script"をクリックします。

enter image description here
するとこんなポップアップが出るので、お好きなアルファベット文字列を入力してください 。(他の人と被った文字列は使えません)
これが今回作るAPIのURLになります。
入力したら"Create"を押して下さい。
enter image description here

ここに、以下の内容をコピペします。認証情報のところだけ自分の情報に書き換えてください。

https://developers.line.me/channels こちらで設定されているChannel ID, Channel Secret, MIDをそれぞれ入れてください。

また、

こんな風に所々解説を書いていますが、-- (ハイフン2個)に続く文字列は"コメント"といってプログラム上では無視されます。 (Lua言語では -- ですが、他の言語では // や # や /* */ が使われることが多いです)

callback URLとIPアドレスをLINEに登録。

今回APIを利用するにあたって、
「LINE側からリクエストを飛ばされるURL(callback URL)」と「LINE側にリクエストを飛ばす元のIPアドレス(サーバーの住所のようなもの)」を設定する必要があります。

「LINE側からリクエストを飛ばされるURL(callback URL)」については
ダッシュボード ( https://developers.line.me/channels )に行き

Basic Information
を選択し、webscriptで設定したurlの最後に:443 (SSLのポート番号)をつけて、

入力して保存します。

また
「LINE側にリクエストを飛ばす元のIPアドレス」
については
Server IP Whitelist
を選択し、IPアドレスを入力します。
利用するサーバーやサービスによって違うのですが、webscriptの場合から1つに固定されてないようなので

54.159.34.187
54.235.119.11
23.23.140.37
この3つを入力しておいてください。

以上で設定は完了です。

設定が反映されるまで待つ。

これらの設定が反映されるまで時間が
人によってはすぐに反映されるようですが、自分の場合30時間ほどかかったので気長に待ちましょう。
反映されたら連絡がくるわけではないので、時々BotにLINEして返事がくるか確認します。

完成

しばらくして返事がきたら完成です!

コードのこの辺をいじるとメッセージの条件を変えられるので色々いじって遊んでみましょう (変更したらsaveを押すのを忘れずに!)

最後に

作ったBotはちゃんと動きましたでしょうか?
webscriptはあくまでプロトタイプ用なので、これが上手くうごいたら次はサーバーを用意するなりして他の言語 (rubyとかphpだと情報源が多そうです)でもうちょっと高度なBot作成も試してみてください。

また、Botに関する情報共有用のFacebookグループを作ってみました。
記事の内容についてやBotについての質問があれば、ここに書いていただければ分かる範囲でお答えするので、興味がある方は是非入って下さい!

こちらです
↓↓↓
Bot Developers

シェアする

Profile

Profile

藤牧宗太郎
Sotaro Fujimaki

紀尾井町のIT企業でエンジニアをしています。
Facebook
Twitter
作った音楽

↓インターネット関連のことをよくつぶやいているので、よかったらフォローお願いします。


follow us in feedly