LINE經營進階篇|line liff應用、liff教學及如何從 line developer 建立 Line LIFF

2022-08-24
Line LIFF 運用 Liff教學

什麼是 Line LIFF?

LIFF ( LINE Front-end Framework ) 是一種可以在 Line 中直接操作網頁的平台。

能取得 User 在該 Provider 及 Channel 中可以用來唯一識別的 UserId、公開的個人資料以及代為傳送訊息至 Chat Bot 的權限。

有了 UserId 便可以與 Chat Bot 及使用 Line Login 或 Account Link 的網站進行用戶資料的串接,進而提供更為全面的服務!

可以把 LIFF App 想像成LINE 的內建瀏覽器。

 

換而言之,就是當好友透過這個內建瀏覽器進行操作,LIFF App 可以幫助商家獲得用戶的 LINE 資訊,

例如好友的 user ID(當然是在獲得好友允許搜集其資料的前提下)。

在 LINE官方帳號點擊連結時,會直接開啟,LIFF App 同時也會幫助商家搜集好友資料。

 

 

該如何建立 LIFF App?

 

了解完什麼是 LIFF App 之後,我們該如何新增一個 LIFF App 呢?

你可以透過 LINE Developers 進行 LIFF App 開設。要特別注意不是透過 LINE 官方帳號管理後台開設哦!

很多人常常分不清這兩個管理平台(這裡提供個簡單的二分法:所有的技術設定找 LINE Developers;與好友互動、經營官方帳號找 LINE 官方帳號管理後台)。

 

由於 LIFF App 是隸屬在 LINE Login 下面,所以我們必須要先擁有一個 LINE Login,還沒有 LINE Login 的話可以先閱讀以下教學文章:

 

ezPretty自動化預約系統|串接LINE店家帳號教學



 

那就來新增一個 LIFF App 吧!

 

步驟一:登入 LINE Login

 

1.登入 LINE Login

 

首先,在 LINE Developers 頁面畫面右上角點選「Log in」,利用「LINE Business ID」登入 LINE Developers 後台。

 

 

2.進入 LINE Developers 後,在對應的 Provider 中找到並點選想要新增 LIFF App 的 LINE Login Channel

 

 

3.進入對應的 LINE Login Channel 後,在上排找到「LIFF 分頁」並點選。

 

 

4.進入 LIFF 分頁後,接續下滑頁面,點選 「Add」開始新增一個 LIFF App。

 

步驟二:輸入資訊

 

新增一個 LIFF App 需要輸入一些基本資訊(Basic information),依照畫面指示依序填入:

 

  • LIFF app name:僅會顯示在 LINE Developers 後台,LINE 好友點選 LIFF App 時並不會看到,填入品牌名稱。
  • Size:LIFF App 在 LINE 被打開時版面呈現的大小,勾選「Fall」讓 LIFF App 全螢幕完整顯示(Tall 為 70% 顯示,Compact 為 50% 顯示)。

 

 

接續填寫基本資訊(Basic information):

新增一個 LIFF App 需要輸入一些基本資訊(Basic information),依照畫面指示依序填入:

 

  • Endpoint URL:好友打開 LIFF App 時會前往的網址,填入品牌的官方網站,或是任何你想要設定的網址。
  • Scopes:希望在 LIFF App 內搜集的資訊,將「profile」和「openid」都勾選起來。
  • Bot link feature:當好友打開 LIFF App 時是否要將好友資料綁定到 LINE 官方帳號,勾選「On(Normal)」。

 

 

接續填寫 Options:

  • Scan QR:不勾選。
  • Module Mode:勾選開啟(只會在 Size 選項選擇「Tall」,或是「Compact」時出現)。

 

 

填寫完成後,點選「Add」我們就可以得到第一個 LIFF App 了!

將 LIFF URL 複製起來貼到 LINE 訊息框裡面,接著拿起手機點開連結看看 LIFF APP 的設定成果吧!

 

 

 

文章搜尋