¶初次見面 LIFF of LINE

這是什麼？

LINE Front-end Framework (LIFF) is a platform for web apps provided by LINE.
The web apps running on this platform are called LIFF apps.

用 LINE 的 瀏覽器打開。可以在前端執行 LINE 的功能。

¶安裝

參考 repo

npm

$ npm install @line/liff 

¶使用

process.env.LIFF_ID 指的是自己申請好的 LIFF_ID 要設定在 .env 檔上面

import liff from '@line/liff'

document.addEventListener("DOMContentLoaded", function() {
  liff
    .init({ liffId: process.env.LIFF_ID })
    .then(() => {
        console.log("Success! you can do something with LIFF API here.")
    })
    .catch((error) => {
        console.log(error)
    })
});

¶設定 LINE

LINE 的應用 (截圖以 MessageingAPI 為例) 上面出現一個 LIFF 的標籤

[color=#00b900]

要先設定 LINE Login 這個功能才會啟動。

在 LINE Login 裡會出現這個

[color=#00b900]

按下「ADD」填一填資料，就可以取得 LINE_ID

[color=#00b900]

¶開發

如果暫時還沒有佈署上去，可以暫時使用 ngrok 取得一個有 https 的網址當作開發用的臨時網址。

初始化成功，就可以來遊樂場參考要使用的功能

liff.isInClient()

判斷是不是在 LINE 裡的 LIFF browser 開啟的。這個 browser 和一般的 web view 不一樣。

liff.getContext()

userId 就是用來發給 Messageing API 功能的主動通知，識別碼

{
    "type": "external",
    "userId": "Ude7ca124379d3f9cde8aee01d5fefdce",
    "liffId": "1656508316-k7jNojXm",
    ...
}

使用 LINE 登入時，可以注意一個特性

每個 LINE 帳號，在一個 provider 會有一個固定的 userID。
如果是不同的 provider 就會有不同的 userID。

而每個 provider 可以擁有不同的 Messageing API 服務，可以做成不同的聊天機器人，它們各自有不同的 Channel ID。
也就是說，相同的使用者，在不同的 Channel ID 下，只要 provider 相同，使用者就有相同的 userID ，可以實現不同的 Messageing API 可以認得出相同的使用者。

Messageing API 的特性

一個 Messageing API 服務，是對應一個 LINE 的聊天機器人。
當使用者加了一個 LINE 聊天機器人，就會觸發一次 webhook。