プラガブルSDK

# プラガブルSDK

# プラガブルSDKとは

プラガブルSDKとは、LIFF SDKに含めるLIFF APIを選択できる機能です。

LIFFアプリで利用するLIFF APIのみをLIFF SDKに含めることで、LIFF SDKのファイルサイズを最大約34%削減できます。その結果、LIFFアプリの表示速度を向上させることができます。

# プラガブルSDKの使用条件

LIFF v2.22.0以降のnpmパッケージ版でのみ利用できます。CDN版では利用できません。npmパッケージの利用方法について詳しくは、「npmパッケージを利用する」を参照してください。

# プラガブルSDKの使用方法

プラガブルSDKの使用方法は、以下のとおりです。

# liffオブジェクトをインポートする

まず、liffオブジェクトを@line/liff/coreからインポートします。

import liff from "@line/liff/core";

このliffオブジェクトには、以下のプロパティとメソッドのみが含まれています。

上記以外のLIFF APIを利用するには、対応するモジュールをインポートします。以下の例では、liff.getOS()メソッドとliff.getAppLanguage()メソッドに対応するモジュールをインポートしています。

import liff from "@line/liff/core";
import GetOS from "@line/liff/get-os";
import GetAppLanguage from "@line/liff/get-app-language";

各LIFF APIに対応するモジュールについては、「LIFF APIと対応するモジュール一覧」を参照してください。

# LIFF APIを有効化する

次に、インポートしたLIFF APIのモジュールをliff.use()メソッドに渡し、LIFF APIを有効化します。LIFF APIのモジュールはクラスで定義されているため、liff.use()メソッドにインスタンスを渡す必要があります。

import liff from "@line/liff/core";
import GetOS from "@line/liff/get-os";
import GetAppLanguage from "@line/liff/get-app-language";

liff.use(new GetOS());
liff.use(new GetAppLanguage());

LIFF APIを有効化すると、LIFF APIを利用できるようになります。

以下の例では、有効化したliff.getOS()メソッドとliff.getAppLanguage()メソッドは利用できますが、有効化していないliff.login()メソッドは利用できません。

import liff from "@line/liff/core";
import GetOS from "@line/liff/get-os";
import GetAppLanguage from "@line/liff/get-app-language";

liff.use(new GetOS());
liff.use(new GetAppLanguage());

liff.init({
  liffId: "123456-abcedfg",
});

liff.getOS(); // 利用できる
liff.getAppLanguage(); // 利用できる
liff.login(); // 利用できない

# プラガブルSDKの注意事項

技術的な制約から、liff.use()メソッドはliff.init()メソッドより前に実行してください。liff.init()メソッドを実行した後にliff.use()メソッドを実行した場合の動作は保証されません。

# liff.use()メソッドの正しい実行例

import liff from "@line/liff/core";
import GetOS from "@line/liff/get-os";

// liff.use()メソッドをliff.init()メソッドより前に実行している
liff.use(new GetOS());

liff.init({
  liffId: "123456-abcedfg",
});

# liff.use()メソッドの間違った実行例

import liff from "@line/liff/core";
import GetOS from "@line/liff/get-os";

liff.init({
  liffId: "123456-abcedfg",
});

// liff.use()メソッドをliff.init()メソッドより後に実行している
liff.use(new GetOS());

# LIFF APIと対応するモジュール一覧

LIFF API モジュール
liff.getOS() @line/liff/get-os
liff.getAppLanguage() @line/liff/get-app-language
liff.getLanguage()（非推奨） @line/liff/get-language
liff.getLineVersion() @line/liff/get-line-version
liff.getContext() @line/liff/get-context
liff.isInClient() @line/liff/is-in-client
liff.isLoggedIn() @line/liff/is-logged-in
liff.isApiAvailable() @line/liff/is-api-available
liff.login() @line/liff/login
liff.logout() @line/liff/logout
liff.getAccessToken() @line/liff/get-access-token
liff.getIDToken() @line/liff/get-id-token
liff.getDecodedIDToken() @line/liff/get-decoded-id-token
liff.permission.getGrantedAll()

liff.permission.query()

liff.permission.requestAll()		 @line/liff/permission
liff.getProfile() @line/liff/get-profile
liff.getFriendship() @line/liff/get-friendship
liff.openWindow() @line/liff/open-window
liff.closeWindow() @line/liff/close-window
liff.sendMessages() @line/liff/send-messages
liff.shareTargetPicker() @line/liff/share-target-picker
liff.scanCodeV2() @line/liff/scan-code-v2
liff.scanCode()（非推奨） @line/liff/scan-code
liff.permanentLink.createUrlBy()

liff.permanentLink.createUrl()

liff.permanentLink.setExtraQueryParam()		 @line/liff/permanent-link
liff.i18n.setLang() @line/liff/i18n
liff.createShortcutOnHomeScreen() @line/liff/create-shortcut-on-home-screen