この記事は、プロトアウトスタジオのアドベントカレンダー2021の12日目です！
LINE Botを実際に生活で使いたいよぉ
以前の記事（ https://qiita.com/tkyko13/items/335277b376c99dcc50be ）ではIFTTTとfitbitを利用して、その日歩いた結果で色々な花瓶が届くものを作ってみました。引っこ抜きボタンでその花瓶にあったピクミンが生まれるというものです。
そこで利用していたのが、localtunnelというもので、ngrokのような一時的に自分のPCをサーバにするものでした。
実際の生活で使うにはずっとPCでlocaltunnelを実行しておくのも大変なので、別のサーバを用意しないといけません。
何も自分のPCを用意する必要もなく、最近では無料で使えるクラウドサービスを使ってずっと使えるようにできるので、そちらのメモを残していこうと思います。
LINE Botで使えそうなサービス
LINE Bot永続化参考サイト
今回は自分もVercelを使ってみたいと思います
やったこと
- dotenv導入
- GitHubへコミット
- Vercelでプロジェクト作成
- プロジェクト、ソースコードの編集
- IFTTT、LINE developでURL編集
dotenv導入
シークレットキーなどみんなに見られてはいけない文字列を別ファイルで管理できる
参考：https://qiita.com/ozaki25/items/3e2cf94f29bd0edc1979
いったん導入後、今まで動作させていたlocaltunnelを使ったやり方で動作確認しておきましょう
GitHubへコミット
https://github.com/ でリポジトリを作ってコミット
忘れずに「.gitignore」に'.env'を書き加えましょう
Vercelへデプロイする際も連携してできるので、予めGitHubリポジトリから作っておくと楽です
Vercelでプロジェクト作成
https://vercel.com/ からユーザ登録 or ログイン、プロジェクト作成します
GitHub（もしくは、GitLab、Bitbucket）のリポジトリ一覧から選ぶとすぐにできます
プロジェクトの編集
- apiフォルダ内に前回作ったプログラムを入れる
- vercel.jsonを作る
- 内容は以下のような感じにIFTTTからやLINEから実行されるパスを記述する（ここらへんは上述した参考サイトを参考に）
- server.jsの編集
- 最後の2行をVercel用に編集
- 編集後でも普通に今まで通り動かせます
{
"version": 2,
"routes": [
{ "src": "/", "dest": "api/server.js" },
{ "src": "/webhook", "dest": "api/server.js" },
{ "src": "/ifttt", "dest": "api/server.js" }
]
}
// 略
// app.listen(PORT);
// console.log(`Server running at ${PORT}`);
(process.env.NOW_REGION) ? module.exports = app : app.listen(PORT);
console.log(`Server running at ${PORT}`);
編集後、改めてGitHubにプッシュしましょう
自動的にVercelにもデプロイされるはずです
「Deployments」タグを見るとちゃんとできてるか確認できます
IFTTT、LINE developでURL編集
Vercelのダッシュボードトップを見るとDOMAINSがあり、すでにURLがもらえている状態です
まずはそのURLにアクセスし、ページが見れたらOK
その後IFTTTには、「VercelのURL + /ifttt」、LINE developには「VercelのURL + /webhook」に変更
もちろんこのURLは変更されないのでこれで永続化できました
使ってみて
実はなぜかまだうまく通知が来てないです…
IFTTTのActivetyではうまくいっているように見えるのですが…
もうちょっと見ている途中です〜