---
title: Azure Container Apps で捗るサーバーレスな LINE Bot ＆ LIFF 開発
tags:  #azure #linedc  
author: [Takumasa Hirabayashi](https://www.docswell.com/user/himanago)
site: [Docswell](https://www.docswell.com/)
thumbnail: https://bcdn.docswell.com/page/VEP9K1QL78.jpg?width=480
description: LINE API開発者向けカンファレンス「REV UP 2022」にて登壇した際の資料です。 https://linedevelopercommunity.connpass.com/event/260460/
published: October 22, 22
canonical: https://www.docswell.com/s/himanago/Z72MDK-azure-container-apps-and-line-api
---
# Page. 1

![Page Image](https://bcdn.docswell.com/page/VEP9K1QL78.jpg)

Azure Container Apps で捗る
サーバーレスな LINE Bot ＆ LIFF 開発
LINE Developers Community REV UP 2022
2022/10/22
平林
拓将（ひらりん）
himarin269 /
himanago


# Page. 2

![Page Image](https://bcdn.docswell.com/page/27VMVY567Q.jpg)

About me
• name： 平林 拓将（ひらりん）
• work： テクニカルトレーナー＆開発
• award/title:
- Microsoft MVP for Azure（2019.11～）
- LINE API Expert（2020.3～）
• like:
- C# / serverless / cross-platform
• social:
-
Twitter：@himarin269
GitHub：himanago
Blog：https://himanago.hatenablog.com/


# Page. 3

![Page Image](https://bcdn.docswell.com/page/5JGGL962JL.jpg)

今回お話しすること（25分）
• サーバーレスにコンテナー・マイクロサービス運用が
できる「Azure Container Apps」。
• このサービスを使って、既存のWeb アプリケーショ
ンを移行し、LINE 連携機能を追加するというシナリ
オを考えていきます。
• LINE Bot や LIFF を運用するにあたって便利な
Azure Container Apps の機能と、LINE API と連携
する機能を開発する際のポイントを、デモを交えてご
紹介します。


# Page. 4

![Page Image](https://bcdn.docswell.com/page/47QXYW49JP.jpg)

今回の例：場所の予約システム（Web アプリ）
C#（ASP.NET Core）
で実装
これを Azure に移行したい


# Page. 5

![Page Image](https://bcdn.docswell.com/page/KE46WKLRJ1.jpg)

Azure Container Apps
サーバーレスなコンテナーアプリを動かすためのサービス
複数のコンテナーを組み合わせてマイクロサービスを運用可能
https://learn.microsoft.com/ja-jp/azure/container-apps/


# Page. 6

![Page Image](https://bcdn.docswell.com/page/L71VYXLVJG.jpg)

Azure Container Apps の構成
Container Apps Environment
Container App
Container App
Container App


# Page. 7

![Page Image](https://bcdn.docswell.com/page/G7WLGNV3J2.jpg)

アプリ（ASP.NET Core）を移行
Container Apps Environment
Azure
Container Registry
SQL Database
Container App
Push
CI/CD
（GitHub Actions）
ASP.NET Core
Webアプリ
コンテナーで動作させる
Push
接続情報など
の管理
Key Vault


# Page. 8

![Page Image](https://bcdn.docswell.com/page/4JZML34G73.jpg)

[DEMO] Container Apps上の予約システム


# Page. 9

![Page Image](https://bcdn.docswell.com/page/YE6NWX3QEV.jpg)

機能拡張はコンテナーを増設
Container Apps Environment
Container App
Container App
Container App
コンテナー同士を連携させることが可能


# Page. 10

![Page Image](https://bcdn.docswell.com/page/GE55MXL2E4.jpg)

Dapr（Distributed Application Runtime）
• マイクロサービス同士の連携
などを容易に開発できるよう
にする
• オープンなAPIで開発言語も
問わない
https://dapr.io/
https://learn.microsoft.com/ja-jp/azure/container-apps/dapr-overview


# Page. 11

![Page Image](https://bcdn.docswell.com/page/972N9XL1JR.jpg)

LINE Bot 機能を追加
予約システム
Bot
Webhook
エンドポイント
（Botバックエンド）
Python（Flask）
で実装


# Page. 12

![Page Image](https://bcdn.docswell.com/page/DJYP48Q4JM.jpg)

予約にはマルチターンの対話が必要
予約したい
どこを？
エリア２
いつ？
10月23日


# Page. 13

![Page Image](https://bcdn.docswell.com/page/V7N5YQK6E8.jpg)

マルチターンはけっこう大変
ユーザー・Bot間で数往復のやりとりをする場合、
会話の経緯（対話コンテキスト）をサーバー側で
覚えておく必要がある
対話コンテキストを
DBなどに保存
Bot
Webhook
エンドポイント
DBなど
メッセージ受信時、
保存された対話コンテキストを
毎回確認し適切な応答を行う
バックエンド


# Page. 14

![Page Image](https://bcdn.docswell.com/page/YJ9YPDVR73.jpg)

Dapr の状態管理で対話コンテキストを保持
Daprを経由してユーザーごとの
対話コンテキストを保存
Container App
(LINE Bot)
state store


# Page. 15

![Page Image](https://bcdn.docswell.com/page/GJ86D3PGED.jpg)

Dapr の状態管理
※ 今回のデモアプリでは
Cosmos DBを使用
https://learn.microsoft.com/ja-jp/dotnet/architecture/dapr-for-net-developers/state-management


# Page. 16

![Page Image](https://bcdn.docswell.com/page/LJL9MV1X7R.jpg)

WebアプリとBotでコンテキストを共有
LINEログインを実装
LINEユーザーIDをキーに状態を保存
Bot
ASP.NET Core
Webアプリ
同一プロバイダー内においては共通のLINEユーザーIDを持つため、
それぞれのサービスでLINEユーザーIDを使う


# Page. 17

![Page Image](https://bcdn.docswell.com/page/47MZYGW3JW.jpg)

[DEMO] Dapr 状態管理によるコンテキスト共有


# Page. 18

![Page Image](https://bcdn.docswell.com/page/P7R69ZYRE9.jpg)

LIFFも使いたい！
予約機能
その他便利機能
スタンプカードや会員証の機能や、
よりリッチな予約機能の提供
（状態共有したい）


# Page. 19

![Page Image](https://bcdn.docswell.com/page/PJXMQ9GYEX.jpg)

LIFF におすすめ：Azure Static Web Apps
• 静的Webサイトホスティングサービス
• カスタムドメイン・SSL 対応
• GitHub との統合による CI/CD
• ステージング環境での PR レビュー
★ ドキュメント
https://docs.microsoft.com/ja-jp/azure/static-web-apps/


# Page. 20

![Page Image](https://bcdn.docswell.com/page/3JKG9P447D.jpg)

Azure Static Web Apps の特徴
/front
</>
ブラウザ
/api
API
バックエンドAPI（Azure Functions）を
同一リポジトリで開発・デプロイ
クロスオリジン制約を
気にすることなく
アクセス可能
組み込みの Functions の代わりに
Container Apps を使うことができる！


# Page. 21

![Page Image](https://bcdn.docswell.com/page/LE3NWXLDE5.jpg)

Container Appsをバックエンドに使用できる
SWA
各アプリにおける
操作状況を共有できる
</>
LIFFフロントエンド
Container Apps Environment
Webアプリ
LINE Bot
LIFFバックエンド


# Page. 22

![Page Image](https://bcdn.docswell.com/page/8EDWK2N27G.jpg)

まとめ
• Azure Container Apps は複数コンテナーの
運用が楽にできるおすすめサービス
• Dapr の機能でコンテナー同士の連携や状態の
共有が可能
• LINE Bot の対話コンテキスト管理、LIFF や
他のアプリとの状態共有で新しいユーザー体験
にもつながる