如何使用Line發送flex message

環境

• 語言

  • python

• SDK

  • linebot.v3

詳情可參考GitHub - line/line-bot-sdk-python: LINE Messaging API SDK for Python以及一大堆網路教學文章。

app.py

套件引入

from flask import Flask, request, abort
from linebot.v3 import WebhookHandler
from linebot.v3.exceptions import InvalidSignatureError
from linebot.v3.messaging import (
    Configuration, 
    ApiClient, 
    MessagingApi, 
    PushMessageRequest, 
    ReplyMessageRequest, 
    TextMessage,
    FlexMessage,
    FlexBubble,
    FlexImage,
    FlexMessage,
    FlexBox,
    FlexText,
    FlexIcon,
    FlexButton,
    FlexSeparator,
    FlexContainer,
    URIAction
) 
from linebot.v3.webhooks import MessageEvent, TextMessageContent
from email_validator import validate_email, EmailNotValidError
import requests
import json
import os

主要是需要

from linebot.v3.messaging import (
    Configuration, 
    ApiClient, 
    MessagingApi, 
    PushMessageRequest, 
    ReplyMessageRequest, 
    TextMessage,
    FlexMessage,
    FlexContainer,
) 

因為v3的教學不多，找了有點久才找到要在messaging這邊引入這些。

配置

# 初始化 Flask 應用
app = Flask(__name__)

# Line bot 配置
configuration = Configuration(access_token=os.environ.get('CHANNEL_ACCESS_TOKEN'))
handler = WebhookHandler(os.environ.get('CHANNEL_SECRET'))

這部分網路上有一堆教學，基本上去line develop申請後可以拿到CHANNEL_ACCESS_TOKEN、CHANNEL_SECRET，如果有部署在某個平台，會將這兩個Token設定成環境變數，安全性較高。

這裡專注於怎麼發flex message。

收到訊息的處理程序

@handler.add(MessageEvent, message=TextMessageContent)
def handle_message(event):

    message_text = event.message.text
    user_id = event.source.user_id

    if message_text == 'flex message':
        line_flex_json = {
            "type": "bubble",
            "header": {
                "type": "box",
                "layout": "vertical",
                "contents": []
            },
            "hero": {
                "type": "box",
                "layout": "vertical",
                "contents": []
            },
            "body": {
                "type": "box",
                "layout": "vertical",
                "contents": [
                {
                    "type": "text",
                    "text": "hello, world"
                }
                ]
            },
            "footer": {
                "type": "box",
                "layout": "vertical",
                "contents": []
            }
        }

        line_flex_str = json.dumps(line_flex_json)
        reply_flex_to_user(event.reply_token, line_flex_str)
        return

def reply_flex_to_user(reply_token, line_flex_str):
    with ApiClient(configuration) as api_client:
        line_bot_api = MessagingApi(api_client)
        line_bot_api.reply_message_with_http_info(
            ReplyMessageRequest(
                reply_token=reply_token,
                messages=[FlexMessage(alt_text='flex Message', contents=FlexContainer.from_json(line_flex_str))]
            )
        )

使用flex message有兩種方式：

1. 使用FlexBubble, FlexImage, FlexBox, FlexText, FlexIcon, FlexButton, FlexSeparator等物件自己刻出一個模板。

2. 使用FLEX MESSAGE SIMULATOR弄出一個JSON模板

這裡推薦使用第二種方式，文章也是使用第二種方式。

參考

GitHub - line/line-bot-sdk-python: LINE Messaging API SDK for Python

AI LineBot練功坊-L09 Message Type(3) Flex Message - YouTube

Flex Message Simulator