本文同步刊載於 Clarence 部落格：[LINE bot 好好玩 30 天玩轉 LINE API] 第 15 天：LIFF 解析大全

前言

做了昨天的範例，相信大家應該很期待今天的講解，今天就來談談 LIFF 的 SDK 細節吧 ~
一起來看看這個 Sample 是怎麼做出來的吧 ~
昨天的 JS 可以直接看這個 Github 連結

Init LIFF

基本上大多數的 SDK 都需要做一個 Init 的動作，會把一些後面程式要用的東西做一些 Init，LIFF 也不例外，Init 的方法

liff.init(function (data) {
    initializeApp(data);
});

開啟 URL

此方法讓使用者可以在 LINE 裡面打開 URL

liff.openWindow({
    url: 'https://line.me'
    external: true
});

默認情況 external 是 false，就是讓這個 URL 用 LINE App 把它打開，如果希望打開它的是外部瀏覽器可以設定成 true

取得使用者 Token

要取得使用者的 Token 就使用 getAccessToken 他可以共用於 Social API

const accessToken = liff.getAccessToken();

驗證使用者

要驗證這個 requset 是從自己的 Line Bot 發的可以使用此 API，使用 Channel ID 做驗證

GET https://api.line.me/oauth2/v2.1/verify

詳細的 API 使用可以查閱

取得使用者 Profile

取得使用者 Profile 的方法可以用 access token 帶入此 API 取得資訊

GET https://api.line.me/v2/profile

詳細的 API 使用可以查閱

取得使用者 Profile

可能有人會覺得奇怪上面不是剛講過取得使用者 Profile 這邊怎麼又講一次，我來與大家娓娓道來，剛剛取得使用者 Profile 的方法是 API 的方法而 LINE 在這邊提供了兩種方法讓我們取得使用者的 Profile 一種是上面說到的 API，另一種是用 LIFF API 使用的方法如下，就看需求哪一個方法比較適合自己使用。

liff.getProfile().then(function (profile) {
    const userId = profile.userId;
    const name = profile.displayName;
    const pictureUrl = profile.pictureUrl;
    const statusMessage = profile.statusMessage;
}).catch(function (error) {
    console.log('error', err);
});

詳細的 API 使用可以查閱

帶發 Message

昨天提到 LIFF 有方法可以用使用的的身份發訊息，大家可以用這個方法做一點不一樣的動作，例如使用者在我們的 LIFF App 上面上傳圖片，讓使用者在網頁對圖片做一點處理後讓使用者發出這張處理過的訊息，如果是使用者跟機器人單獨的視窗可能沒什麼好玩的，但如果今天的視窗是群組呢？是不是就可以做出滿多好玩的事情了？幫大家開個頭，還可以盡情的想像好玩的功能 ~

liff.sendMessages([{
    type: 'text',
    text: "You've successfully sent a message! Hooray!"
}]).then(function () {
    window.alert("Message sent");
}).catch(function (error) {
    window.alert("Error sending message: " + error);
});

發送訊息的限制與前面的 API 都依樣，只能發送 5 則訊息

關閉 LIFF

純粹就是幫使用者關閉視窗 XD

liff.closeWindow();

結論

鐵人賽也過一半了，LINE Message 會用到的方法也差不多都介紹完了，下一篇來講個爬蟲好了，來做一個小小的 Project 把前面學到的東西做一點整理，做出一個真的可以用的 LINE Bot 吧 ~

工商時間

團隊系列文

CSScoke - 金魚都能懂的這個網頁畫面怎麼切 - 金魚都能懂了你還怕學不會嗎
King Tzeng - IoT沒那麼難！新手用JavaScript入門做自己的玩具～
Hina Hina - 陣列大亂鬥
阿斬 - Python 程式交易 30 天新手入門
塔塔默 - 用Python開發的網頁不能放到Github上？Lektor說可以！！
Vita Ora - 好 Js 不學嗎 !? JavaScript 入門中的入門。