LINE Front-end Framework (LIFF)

# LINE Front-end Framework (LIFF)

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

LIFFアプリを使うと、LINEのユーザーIDなどをLINEプラットフォームから取得できます。LIFFアプリではこれらを利用して、ユーザー情報を活用した機能を提供したり、ユーザーの代わりにメッセージを送信したりできます。

LIFF v2で追加された機能については、「リリースノート」を参照してください。

今後追加が予定されている機能については、『LINEログインドキュメント』のロードマップを参照してください。

LIFFの機能をウェブ上で試せます

LINEヤフー株式会社では開発者向けにLIFFプレイグラウンド (opens new window)というウェブアプリ（LIFFアプリ）を提供しています。LIFFプレイグラウンドではLIFFの基本的な機能が試せます。LIFFを用いるとどのようなことができるのかを確認したいときに参照してください。なお、LIFFプレイグラウンドのソースコード (opens new window)をGitHubで公開しています。

OpenChatでのLIFFアプリの利用はサポートされていません

現在のところ、OpenChatではLIFFアプリの利用は正式にサポートされていません。たとえば、LIFFアプリからプロフィール情報を取得できない場合があります。

# デモ用のLIFFアプリを体験する

LINE API Use Case (opens new window)では、デモ用のLIFFアプリと、そのソースコードを公開しています。お手持ちのスマートフォンでデモ用のLIFFアプリを開いて、店舗予約やテーブルオーダーを体験してみましょう。

# 推奨環境

LIFFの推奨環境は以下のとおりです。

なお、LIFFアプリをLIFFブラウザで開いた場合と、外部ブラウザで開いた場合では、使用できる機能が異なります。たとえば、liff.scanCode()は、外部ブラウザでは利用できません。詳しくは、「LIFF v2 APIリファレンス」を参照してください。

# LIFFアプリをLIFFブラウザで開く場合

項目	推奨環境	最低動作環境
iOS	最新バージョン。WKWebView (opens new window)が使用されます。	LINEの推奨環境に準ずる。 *
Android	最新バージョン。Android WebView (opens new window)が使用されます。	LINEの推奨環境に準ずる。 *
LINE	最新バージョン	LINEの推奨環境に準ずる。 *

LIFFアプリは、OS、LINEともに最新バージョンの環境での利用を推奨します

LIFFアプリは、OS、LINEともに最新バージョンの環境での利用を推奨します。上記の「最低動作環境」以降のバージョンでも、機能や設定によっては動作しない場合や画面が正常に表示されない場合があります。

* LINEの推奨環境については、ヘルプセンターの「LINEの推奨環境を教えてください (opens new window)」を参照してください。

# LIFFアプリを外部ブラウザで開く場合

以下のブラウザの最新バージョンで動作します。

Microsoft Edge、Google Chrome、Firefox、Safari

# LIFFブラウザ

LIFFブラウザはLIFFアプリ専用のブラウザです。ユーザーがLINEでLIFFのURLを開くと、LIFFブラウザでLIFFアプリが開きます。

LIFF browser

LIFFブラウザはLINE内で動作するため、LIFFアプリはユーザーにログインを促さなくてもユーザーデータにアクセスすることができます。また、LIFFブラウザはLIFFアプリを共有したり、LIFFアプリから友だちにメッセージを送るなど、LINE特有の機能を提供しています。

# LIFFブラウザの仕様

LIFFブラウザは、iOSではWKWebView (opens new window)、AndroidではAndroid WebView (opens new window)を利用しています。そのため、LIFFブラウザの仕様および動作についてもこれらの仕組みに準拠します。

なお、LIFFブラウザは、外部ブラウザがサポートしているウェブ技術の一部をサポートしていません。詳しくは、「LIFFブラウザと外部ブラウザの違い」を参照してください。

# LIFFブラウザのキャッシュ

LIFFブラウザが利用しているWKWebView (opens new window)やAndroid WebView (opens new window) は、表示したコンテンツの内容を、Cache-Control (opens new window) などのHTTPヘッダーの指示に従って、キャッシュとして保存して利用する場合があります。

LIFFブラウザにおけるキャッシュの制御については、Cache-Control (opens new window) などのHTTPヘッダーを用いて行ってください。

キャッシュの削除について

LIFFブラウザに保存されたキャッシュを明示的に削除することはできません。

# LIFFブラウザの画面サイズ

LIFFブラウザは、以下の3つの画面サイズで表示できます。

画面サイズ

画面サイズは、LIFFアプリをLINEログインチャネルに追加するときに指定します。詳しくは、「LIFFアプリをチャネルに追加する」を参照してください。

# アクションボタン

LIFFアプリの画面サイズをFullに指定している場合、ヘッダーには、デフォルトでアクションボタンが表示されます。

アクションボタンを非表示にする

LINE DevelopersコンソールでLIFFアプリの［モジュールモード］をオンにすると、アクションボタンを非表示にできます。詳しくは、「LIFFアプリをチャネルに追加する」を参照してください。

アクションボタンを押すと、マルチタブビューまたはオプションのどちらかがLINEアプリのバージョンに応じて表示されます。LINEバージョン15.12.0以降ではマルチタブビューが表示され、LINEバージョン15.12.0未満ではオプションが表示されます。

# マルチタブビュー

マルチタブビューには、使用中のLIFFアプリのオプションと最近使用したサービスが表示されます。

オプション
最近使用したサービス

# オプション

以下のオプションが、ユーザーのLINEアプリの設定言語で表示されます。

項目	説明
シェア	現在開いているページのパーマネントリンクを、LINEメッセージでシェアします。
ページを最小化	LIFFブラウザを最小化します。詳しくは、「LIFFブラウザを最小化する」を参照してください。
更新	現在開いているページを再読み込みします。
権限設定	権限設定画面を開きます。権限設定画面では、現在開いているLIFFアプリのカメラやマイクへのアクセス権を確認できます。変更はできません。LINEバージョン14.6.0以降で利用可能です。

パーマネントリンクのシェアに失敗する場合があります

現在のページのURLがLINE Developersコンソールの［エンドポイントURL］に指定したURLで始まらない場合、パーマネントリンクを取得できずシェアに失敗します。

# 最近使用したサービス

最近使用したサービスには、ユーザーが開いたLIFFアプリが、利用履歴の新しい順に最大50件まで表示されます。

LIFFアプリを閉じたり、別のLIFFアプリを新たに開いたりするとその時点のスクリーンショットが利用履歴として表示されます。ユーザーは利用履歴を使って、LIFFアプリを再度開くことができます。

LIFFアプリが利用履歴から再度開かれた際、LIFFアプリは再開または再読み込みされます。再開、再読み込みの仕様は、以下のとおりです。

再度開かれた際の挙動	条件	仕様
LIFFアプリが再開される	以下の条件を両方満たすLIFFアプリ 12時間以内に使用したLIFFアプリ利用履歴の最新10件に含まれるLIFFアプリ	ユーザーが使用を中断した画面からLIFFアプリが再開します。アクセストークン、ブラウザの閲覧履歴、画面のスクロール位置は保持されています。
LIFFアプリが再読み込みされる	再開される条件を満たさない場合	ユーザーが使用を中断したURLでLIFFアプリが初期化されます。アクセストークン、ブラウザの閲覧履歴、画面のスクロール位置は破棄されます。

再度開かれた際の挙動

条件

仕様

LIFFアプリが再開される

以下の条件を両方満たすLIFFアプリ

12時間以内に使用したLIFFアプリ
利用履歴の最新10件に含まれるLIFFアプリ

ユーザーが使用を中断した画面からLIFFアプリが再開します。アクセストークン、ブラウザの閲覧履歴、画面のスクロール位置は保持されています。

LIFFアプリが再読み込みされる

再開される条件を満たさない場合

ユーザーが使用を中断したURLでLIFFアプリが初期化されます。アクセストークン、ブラウザの閲覧履歴、画面のスクロール位置は破棄されます。

# 最近使用したサービスに表示される条件

最近使用したサービスにLIFFアプリが表示されるには、以下の条件をすべて満たす必要があります。

LINEアプリのバージョンが15.12.0以降
LIFFアプリの画面サイズにFullを指定
LIFFアプリのモジュールモードがオフ

# 最近使用したサービスに表示される単位

最近使用したサービスでは、LIFFアプリがLIFF ID単位で表示されます。同じLIFFアプリを「最近使用したサービス」以外から再度開いた場合は、新たにLIFFアプリが開かれ、古いLIFFアプリは終了します。

なお、LIFF間遷移で他のLIFFアプリを開いた場合は、異なるLIFF IDであっても1つのLIFFアプリとしてまとめて表示されます。

# LIFFアプリが再読み込みされた場合`liff.sendMessages()`メソッドは使用できません

最近使用したサービスから再読み込みされたLIFFアプリで、liff.sendMessages()メソッドを使用するとエラーが発生します。このため、LIFFアプリが再読み込みされた場合liff.sendMessages()メソッドは使用できません。

LIFFアプリが再読み込みされた後にliff.sendMessages()メソッドを使いたい場合は、トークルーム上のLIFF URLをタップするなどしてLIFFアプリを開き直す必要があります。

# 開発上のガイドライン

LIFFアプリを開発する際は、「LIFFアプリ開発ガイドライン」に従ってください。

# LIFFアプリの開発をサポートするツール

LINEヤフー株式会社では、開発者の方々がLIFFアプリの開発をより円滑に行えるよう、以下のツールを提供しています。

ツール名	このツールでできること
LIFFスターターアプリ	LIFFについて初めて学ぶ人向けのスターターアプリです。LIFFアプリの開発の始め方を理解しやすいよう、LIFFアプリの初期化のデモのみを行っています。まずは動くものを作って、LIFFの概要を大まかに理解したい方にお勧めです。
Create LIFF App	LIFFアプリの開発環境がコマンド1つで構築できるCLIツールです。ReactのCreate React App (opens new window)や、Next.jsのCreate Next App (opens new window)のように、Create LIFF Appからの質問に答えていくことで、用途に合わせたLIFFアプリのひな形を含む開発環境が生成され、すぐに開発を始めることができます。
LIFF CLI	LIFFアプリの開発を円滑にするCLIツールです。LIFF CLIでできることは次のとおりです。 LIFFアプリを作成、更新、参照、削除する LIFFアプリの開発環境を作成する LIFFアプリをLIFF Inspectorでデバッグするローカル開発サーバーをHTTPSで起動する今後のアップデートでLIFF Mockの機能も追加される予定です。
LIFFプレイグラウンド (opens new window)	LIFFの機能をオンライン上で試すことができます。LIFFプレイグラウンドのソースコード (opens new window)はGitHubで公開していますので、開発者は任意のLIFF IDを設定して、独自のLIFFプレイグラウンドをサーバー上にデプロイすることも可能です。