最近のLINE Account Connectでもう必須となっていると思われるLIFF。

今回はLIFFの各機能とその利点、OAM上での設定方法についてまとめました。

LIFFの概要

LINE社公式では下記のように表現されています。

「LINE Front-end Framework（LIFF）は、LINEが提供するウェブアプリのプラットフォームです。このプラットフォームで動作するウェブアプリを、LIFFアプリと呼びます。」

これをもう少し簡単に表現すると、LIFFとは

「LINEアプリ上で開くことが可能な、様々な機能を実装することができるWEBブラウザ」

であると言えます。

LIFFの機能

上記の「様々な機能」とは具体的にどのような機能なのでしょうか。

以下に実装可能な各機能をまとめました。

1. LINEログイン
2. LIFFが起動された画面の取得
3. QRコードリーダーから取得した文字列をアクセストークンと組み合わせる

①LINEログイン

LINEログインとは、LINEのアカウント情報を利用して会員登録やログインを簡単に行えるようにする機能です。

現在では多くのECサイトやスマホアプリで採用されている機能です。

②LIFFが起動された画面を取得

ユーザーが、LINE画面上のどこでLIFFを起動したのかを取得する機能です。

これを利用することで、1to1やグループ、ルームなど様々なLINEのトーク画面の中から、どのタイミングでユーザーがLIFFを起動したのかを判断できるようになり、ユーザーの行動履歴をマーケティング活動に活用することが可能になります。

③QRコードリーダーから取得した文字列をアクセストークンと組み合わせる※

いままではQRコードの中にユーザーに入力してほしい文字列をあらかじめURLスキームで設定し、QRコードを読み取ったあとユーザーに遷移してもらうか、または送信をしてもらう必要がありました。

しかし、LIFFではアクセストークンと組み合わせることで、読み取ったQRコードの文字列をユーザーの代わりに自動でメッセージ送信をさせることが可能になりました。
ユーザーに要求する操作手順を減らすことができるので、離脱の防止につなげることが可能です。

※20191216現在、技術上の問題からios9.19.0以降利用不可。

LIFFの利点

LIFFの一番の特徴として

「ユーザーから見るとLINEから離脱していないUI」

が挙げられます。

ブラウザのサイズを

「FULL」「TALL」「COMPACT」

の３種類から指定することが可能で、特にTall, Compactに関しては、ユーザーからみれば

WEBや他のアプリへの遷移ではなく、まるでLINEの一機能という認識をしてもらえるUIとなっています。

また、通常のLINEログインでは標準ブラウザから起動した際、メールアドレスとパスワードの入力画面が表示される場合があり、ここでの離脱が問題となっています。

LIFFを利用したLINEログインはすべて「LINEアプリ内」で実施されるため、上記

のような、ユーザーに入力を要求する画面は表示されない仕様となっています。

LIFFの開発

様々なことができるLIFFですが、開発はそれほど難しくありません。

LINE側から配布されている公式SDKを導入し、各種APIを呼び出す形で実装が可能です。

スターターアプリも用意されているため、何ができるかこちらで試すこともできます。

開発時に躓くポイントがあるとすれば、htmlキャッシュだと思われます。

ブラウザ側のキャッシュではなく、LINEアプリ内でキャッシュされる仕様になっています。

うまくLIFFが動かない場合はLINEアプリのキャッシュを確認してみてください。

LIFFの設定

アプリを作成し、OAM側からLIFFを設定すると、LIFFとしてアクセスできるURLが発行されます。

まずはLINE developerにアクセスし、LINEログインチャネルを作成します。

※現在はMessagingAPIでもLIFFの登録ができますが、LINE側からの公式発表で2020年2月以降、MessagingAPIではLIFFの登録ができなくなります。

LINEログイン後、メニュー一番右の「LIFF」をクリックし、LIFF作成を始めます。

こちらのページでLIFFの設定を行います。

LIFFアプリ名：

わかりやすい名前にしておけばOKです。

サイズ：

前述した「FULL」「TALL」「COMPACT」から選択します。

エンドポイントURL：

開発したhtmlを設置したURLを記載します。

Scope：

利用したいAPIによって権限を指定します。openidかprofileどちらかは必須になります。

ボットリンク機能：

LIFF側からMessagingAPIのbotを友だち追加することができます。

Nomal：

権限追加と同じページで、デフォルトオフで友だち追加できるボタンを表示できます。

Aggressive：

権限追加ページの次のページで、友だち追加するかどうか選択するページを表示できます。

上記を設定した上で「作成」を押下すると、以下のようにLIFF用URLが発行されます。

まとめ

• LINEログイン使うならLIFFつかうことを検討してみたほうがいい
• QRは便利だけどいまは使えない
• 実装でつまったらキャッシュを疑う
• LIFFを作るときはLINEログインチャネルで作成

上記を抑えておくと良いと思います。