# Linebot 入門 - 小專案課程 1

{%preview https://www.canva.com/design/DAGkfM5ZqJs/3yt1W5xFoC_-aW3jiv2oGw/view?utm_content=DAGkfM5ZqJs&utm_campaign=designshare&utm_medium=link2&utm_source=uniquelinks&utlId=ha18dfb8b7b %}

### 今日課程

* 目標：使用 LINE Messaging API 來開發機器人，並通過 render 部署。完成簡易的機器人

* 示範案例：開發一個能在LINE中回傳使用者消息的機器人

* 技術：LINE Messaging API、Render、Python、Github
---
## LINE Bot 是什麼？

**LINE Bot** 是一種自動化聊天機器人，運行在 **LINE 平台** 上，可以與使用者進行互動，例如 **回應訊息、提供資訊、處理訂單、執行特定功能** 等。透過 LINE Bot，開發者可以設計自動回應機制，提升客服效率，或提供更多互動體驗。

---

### 📌 **LINE Bot 的核心概念**

#### 1️⃣ **Webhook（網頁回呼機制）**
當使用者傳送訊息給 LINE Bot，LINE 會將該訊息透過 **Webhook URL** 傳送到伺服器，開發者的後端程式（如 Flask、Django）可以解析訊息並回應。

#### 2️⃣ **Messaging API**
LINE 提供 **Messaging API** 讓開發者可以 **發送、接收訊息**，並提供更進階的功能，例如：
- **文字、圖片、影片、音訊回應**
- **按鈕選單、地圖、模板訊息**
- **自動推播訊息（Push Message）**
- **用戶管理（User ID, Group ID）**

#### 3️⃣ **LINE Developers 平台**
開發者需要到 [**LINE Developers**](https://developers.line.biz/) 註冊帳號，建立一個 **LINE 官方帳號（LINE OA）**，並獲取 **Channel Access Token**，才能讓機器人與使用者互動。

---

### 📌 **LINE Bot 的常見應用**
| 應用場景 | 說明 |
|---------|-----|
| **自動客服** | 透過 LINE Bot 提供的自動回覆，減少人工客服負擔 |
| **訂單管理** | 讓使用者透過 LINE Bot 訂購產品或查詢訂單狀態 |
| **天氣 / 股票查詢** | 讓使用者輸入指令，回應即時資訊 |
| **社群互動** | 透過遊戲、抽獎、投票等方式，提升用戶參與度 |

---

### 📌 **LINE Bot 運作流程**
1. **使用者傳送訊息**
2. **LINE 伺服器轉發訊息到 Webhook**
3. **後端處理訊息，回傳對應的回應**
4. **LINE 伺服器將回應傳送給使用者**

---

### 📌 **LINE Bot 需要準備的環境**
- **LINE 官方帳號**
- **Flask/Django 後端伺服器**
- **LINE Developers 平台設定 Webhook**
- **Channel Access Token & Secret**
- **部署伺服器（Heroku、Render、VPS 等）**

透過 LINE Bot，可以將聊天機器人整合到各種應用中，提供即時互動與自動化服務！

了解linebot是什麼之後，就開始實作吧～

---
## Line Business 帳號設定
### 第一步：建立 Line 商用帳號

1. 進入： https://developers.line.biz/en/

2. 點擊右上 'Log in to Console'，登入你的 Line 帳號

3. 'Create a new provider' 創建新的供應商
* 以前沒有 provider 的頁面：
* 有 provider 的頁面
* 新增頁面

4. Create a Messaging API channel

5. 建立LINE官方帳號

6. 建立完成，點擊進入 Line Official Account Manager

:::info
### Line Business 帳號設定 - 進階補充

#### 1. Provider 是什麼？
- **Provider** 是一個「開發者帳戶」，你可以在這個 provider 底下建立多個 Line Bot 或其他應用程式。
- 一個 Provider 可以代表一家公司或個人開發者，方便管理不同的應用。

---

#### 2. Messaging API vs. LINE Official Account
| 功能 | Messaging API (Bot) | LINE Official Account (OA) |
|---------------|----------------|-------------------|
| 自動回應訊息 | ✅ | ✅ |
| Webhook | ✅ | ❌ |
| API 發送訊息 | ✅ | ❌ |
| 手動發送訊息 | ❌ | ✅ |
| 適合對象 | 互動式聊天機器人 | 一般企業公告帳號 |

💡 **選擇建議**：
- 如果要開發 Chatbot，請選擇 **Messaging API**。
- 如果只是定期發送公告，選擇 **LINE Official Account** 即可。

---

#### 3. 免費 vs. 付費方案 (以官方網站為準)
- **免費方案**：每月可傳送 **200** 則訊息（超過需付費）。
- **付費方案**：訊息費用依照發送數量計費，適合有大量訊息需求的應用。

📖 [LINE 官方帳號費用](https://tw.linebiz.com/faq/oa-price/)

:::

### 第二步：設定 LINE Messaging API

1. 點擊右上角設定

2. 點擊 Messageing API，並啟用

3. 記住 '**Channel secret**'
4. 點擊下方 'LINE Developers'
5. 點擊左方你的 Admin 名稱，並進入 Channel

6. 點擊 Messaging API，點擊最下方 'Channel access token' 的 Issue 並記住

7. 回到'[Line Official Account Manager](https://manager.line.biz/)'，點擊左側到'回應設置'，關閉自動回覆訊息

:::info
### Channel ID & Channel Secret & Access Token
| 欄位名稱 | 用途 |
|--------------|---------------------------------------------------|
| **Channel ID** | 用來識別你的 Bot，主要是在後台查看用的。 |
| **Channel Secret** | 類似 API 金鑰，搭配 Webhook 驗證請求來源。 |
| **Access Token** | 發送訊息的憑證，每次發送訊息時都需要這個 Token。 |

💡 **安全性建議**：
- 不要把 **Channel Secret** 和 **Access Token** 直接寫在程式碼裡，可以用 `.env` 檔案管理。
- 如果 **Access Token** 遺失，可以在後台重新產生。
:::

## 聊天 API
### Python 程式碼
目前是一個簡單回傳使用者訊息的一個 Python 檔，使用 Github 的 fork 功能，複製到自己的 github
https://github.com/xujk0217/GDG_linebot_test

### Render 部署
你需要有一個在網路上執行你程式的地方，Line 才可以使用你的程式回訊息
https://dashboard.render.com/

1. 註冊 Render
2. 新增一個 Web Service
3. 將你 Github 的網址傳到 Public Git Repository
4. 設定 Render 細節
* 點擊免費方案
* 設定 Build Command：`pip install -r requirements.txt`
* 設定 Start Command：`python app.py`
* Environment：
* LINE_TOKEN=`your_line_channel_access_token`
* LINE_SECRET=`your_line_channel_secret`
放入剛剛存起來的 token 和 secret

5. 過一段時間後，會顯示綠色的 Live ，這是代表 Deploy 成功，可以讓 Line使用
複製你的網址，如：`https://gdg-linebot-test.onrender.com`（這是我的，不要複製這個）

6. 回到 Line Developers ，並點擊 Messaging API，下滑到 Webhook setting，點擊 'Edit'
並將你剛剛的網址複製貼上，並開啟 'Use webhook'，就完成了！

:::info
### GitHub 小知識
- **Fork**：將他人的開源專案複製到自己的 GitHub 帳號，可以自由修改，適合用來學習或開發自己的版本。
- **Clone**：從 GitHub 下載專案到本地電腦，通常使用 `git clone` 指令使用。
- **Pull Request (PR)**：如果修改後想貢獻回原專案，可以提交 PR，讓原作者審核後合併。

📖 [GitHub 官方文件](https://docs.github.com/en/get-started/quickstart/fork-a-repo)

---

### Render 小知識
- **Web Service**：Render 主要用來部署 Web 應用，例如 Flask、Django 等，適合對外提供 API 的專案。
- **免費方案限制**：
- 伺服器如果 **15 分鐘內沒有請求**，會進入休眠，下一次請求可能會有冷啟動時間。
- **環境變數 (Environment Variables)**：
- 可以在 Render 的設定頁面中新增環境變數，例如 `LINE_TOKEN` 和 `LINE_SECRET`，避免將敏感資訊寫死在程式碼裡。

📖 [Render 官方文件](https://docs.render.com/)

:::

## 目前進度
* 可以傳送訊息，並且回傳我的訊息

:::info
因為 Render 會進入休眠，所以**15 分鐘內沒有請求**沒有去使用的話，下一次傳送訊息時需要一小段時間去喚醒，或是重新 Deploy
:::

:::warning
如果回覆還是 Line 的預設回覆的話，有可能是 Render 的環境變數`LINE_SECRET`和`LINE_TOKEN`設定錯了，導致無法正確回覆，可以到 Render 網站的設定的 Environment Variable 的地方檢查是否正確
:::
## Line 小功能
### 圖文選單
常可以看到商業帳號下面有一個 3~6 格的選單

這些按鈕按了之後常會出現一些常見回覆或是選項，接下來是教學

可以先下載下面的三格範本
[Link](https://drive.google.com/drive/folders/1PpJdG_gDDx-sxCtqmDxVCxHZFjDJjxmg?usp=sharing)
選單範例：
範本（可以依這個比例去製作你的圖片）：

1. 到 [Line Official Account](https://manager.line.biz/)，點擊左側 '圖文選單'

2. 建立圖文選單

3. 完成基礎設定
* 標題：自己好管理就好
* 選擇版型：依需求選擇，範例選擇小型三格
* 上傳整體圖片

4. 選擇各種按鈕（A, B, C）範圍的動作
可以以文字為主，依據文字可以去自動回覆固定的動作，像是提供固定資訊，選單之類的。

## 回饋問卷
https://tally.so/r/3lzadB

---
## 完成第一堂入門課～
### 下一堂課：
https://hackmd.io/@k0217/rJu6Q5YY1x