Day07 LIFF (LINE Front-end Framework)


LIFF (LINE Front-end Framework)是LINE於2018年更新的一個功能,類似建立一個短網址( line://app/……),點擊之後會使用LINE內置瀏覽起開啟你所設定的網站,那LIFF有什麼特色呢?

  • 藉由LIFF開啟的web,可以經由java script取得LINE Profile
  • 開啟時畫面依然在LINE應用程式中
  • 傳送訊息

當然LIFF從2018年至今,也會有所改版與更新,在今年(2020年)來說,剛轉換到LIFF v2版本,所謂的v2版本是LIFF往後只能在Login API中建置,所以如果有興趣的朋友,如果看到文章裡面的介紹,LIFF是由CURL或者在Messaging API建置的,都可能是屬於比較舊的版本了(不完全100%是,但可以看有無下面新增的功能判斷),但是除了建置外,大部分舊的功能都跟新的沒有差異很大。

v2的功能與v1相比之下,只有增加沒有減少。

LIFF v2多的功能如下

  • getOS - 取得裝置系統
  • getLanguage - 取得語言設定
  • getVersion - 取得版本。
  • isInClient 是否由LIFF開啟 。
  • isLoggedIn - 是否已登入 LINE Login ( LIFF的情況下通常為已登入,只有外部瀏覽器才會有未登入)
  • login -
    讓使用者進行 LINE Login。如果使用者是在LINE開啟瀏覽器方式進行登入,不會有登入頁面,而是直接進行背景登入,只有在外部瀏覽器的情況下,使用者會轉到 LINE 登入畫面進行登入。
  • Logout - 登出。
  • scanCode - 讓使用者直接開啟 相機模式掃描QR code(部分系統不支援,建議不使用)

v2也因為支援了開啟外部瀏覽器,所以才有isLoggedIn…等狀態,提供開發人員使用。

LIFF畫面尺寸分為

  • Compact 50%
  • Tall 80%
  • Full 100%

開發LIFF建議需要懂一點java script與RWD,因為畢竟網頁是在移動裝置上開啟,所以使用RWD的話,整體上會比較舒適。

設定好LIFF相關網址之後,建議直接找範例,範例都會有全部的功能,不用自己從零開始。

另外開發LIFF的時候,因為是在移動裝置上顯示,如果有什麼錯誤,很難debug,所以特別推薦使用vConsole來協助開發,至於vConsole是什麼?就建議各位讀者自行餵狗(google)了

總結

  • 如果你需要在chatbot設計一個問券,你可以使用LIFF,LIFF可以協助你在LINE 開啟一個Web,並且還可以取得LINE的用戶基本資料。

  • 如果你需要一個客製化的模板,你可以考慮使用Flex message。

  • 如果你需要類似遊戲的XXX登入,你則可以考慮使用 LINE Login。

  • 如果你需要做一個EDM,你可以考慮使用Imagemap message。

#Chatbot
用閒聊這個詞,是分享自己的經驗 這系列主要是說一下對話機器人與LINE Developers的一些內容 希望對於有興趣,但不是很清楚的朋友有所幫助






Related Posts

MTR04_0627

MTR04_0627

用 CSS Grid 創造蒙德里安藝術

用 CSS Grid 創造蒙德里安藝術

[Week 1] Command Line 入門 & 基本指令

[Week 1] Command Line 入門 & 基本指令

前後端分離與 SPA

前後端分離與 SPA

Donut Maze 1

Donut Maze 1

# JavaScript 技能 : NPM 心得

# JavaScript 技能 : NPM 心得



Comments