# Opening a LIFF app
The LIFF app can be opened in a LIFF browser or an external browser. This section describes the operations that allow users to open the LIFF app.
Users access the LIFF URL.
The LIFF URL is issued when Adding the LIFF app to your channel.
For example, enter the URL on the LINE chat screen and tap the URL displayed in the bubble to open the LIFF app.Users agree to grant the required permissions to the LIFF app.
The LIFF app is displayed.
When users access the LIFF URL, the LIFF app will open in a LIFF browser on LINE, or an external browser. Which environment is used depends on the Universal Links (opens new window) or App Links (opens new window) specifications.
It's possible to open a LIFF app in native apps other than LINE. However, we don't guarantee where it will be opened, as it depends on the WebView specifications of the native app.
# Behaviors from accessing the LIFF URL to opening the LIFF app
The following describes how to set up two redirect destinations so that the LIFF app opens correctly when users access the LIFF URL, and when to execute the liff.init()
method when users access the LIFF URL.
Redirect to | Description |
---|---|
Primary redirect URL | The first time users access the LIFF URL, they are redirected from the LIFF server to this URL. When users are redirected to this URL, execute the liff.init() method. |
Secondary redirect URL | When executing the liff.init() method, users are redirected to this URL. Once users are redirected to this URL, the LIFF app page is displayed. |
Don't change the URL during server or front-end processing before the Promise
object returned by the liff.init()
method is resolved. If you change the URL, it will return 'INIT_FAILED' and the LIFF app can't be opened.
For more information on other precautions when initializing the LIFF app, see Initializing the LIFF app.
# Create a LIFF URL
The LIFF URL is a URL that indicates the LIFF server provided by LY Corporation. A LIFF URL is issued by adding the LIFF app to your channel.
# Create a primary redirect URL
The primary redirect URL is always the URL specified in the Endpoint URL of the LINE Developers Console.
All additional information specified in the primary redirected URLs (e.g. path_A/?key1=value1#URL-fragment
) is included in the liff.state
query parameter.
e.g. https://example.com/2020campaign/?key=value&liff.state=urlencoded(path_A/?key1=value1#URL-fragment)
If you don't specify any additional information in the LIFF URL, the liff.state
query parameter is omitted.
# Create a secondary redirect URL
The secondary redirect URL depends on the URL that users access.
The paths and query parameters (/2020campaign/?key=value
) specified in the Endpoint URL of the LINE Developers Console are included in the secondary redirect URL.
URL that users access | Secondary redirect URL |
---|---|
LIFF URL (1) e.g. https://liff.line.me/{liffId} | The URL specified in Endpoint URL of the LINE Developers Console. e.g. https://example.com/2020campaign/?key=value |
The LIFF URL including additional information (2) e.g. https://liff.line.me/{liffId}/path_A/?key1=value1#URL-fragment | As shown in (2) of the below figure, the URL is a combination of 3 types of information.
https://example.com/2020campaign/path_A/?key=value&key1=value1#URL-fragment |
# Opening a LIFF app from another LIFF app (LIFF-to-LIFF transition)
When a LIFF app is open in the LIFF Browser, you can click on the link to another LIFF app to display the other app while keeping the LIFF Browser open. Since the LIFF browser doesn't close during LIFF-to-LIFF transitions, you can click the return button on the LIFF browser to return to the LIFF app from which you transitioned.
- The conditions that make LIFF-to-LIFF transitions possible
- On the liff.init() Promise object on LINE versions earlier than 12.13.0
- Behavior based on screen size of the LIFF app
- About the "chat_message.write" scope after transitioning between LIFF apps
- Get URL from before LIFF-to-LIFF transition
If you are using an older version of the LIFF SDK, you may experience the following unexpected behaviors:
- Despite that you moved from a LIFF URL specified by Path (
/path
) to a different LIFF app, you still end up on the URL specified in the Endpoint URL of the LINE Developers Console. - If you click Cancel on the Consent screen where you seek user authorization, you must close your LIFF browser once.
- If the destination is a LINE MINI App, the design of the LIFF browser header does not automatically change.
When designing to enable transitions between multiple LIFF apps, it is recommended that you use the latest version of the LIFF SDK.
When you access another URL from a LIFF app, a message saying, "Switched to the {LIFF app name} app." may be displayed.
This message is displayed when you open a LIFF app with a different LIFF ID than LIFF app that was opened first (the LIFF app from which the transition is made). Whether or not this message is displayed has nothing to do with the success of LIFF-to-LIFF transitions.
# The conditions that make LIFF-to-LIFF transitions possible
LIFF-to-LIFF transitions are possible when all of the following conditions are met:
- LIFF SDK v2.4.1 or later and LINE 10.18.0 or later
- The original LIFF app screen is set to
Full
display - The LIFF app to which you are moving is correctly initialized by
liff.init()
# On the liff.init() Promise object on LINE versions earlier than 12.13.0
On LINE versions earlier than 12.13.0, when transitioning to another LIFF app, liff.init()
method will automatically execute liff.login()
method internally for the LINE Login process. Therefore, during this screen transition, the Promise
object will not be resolved or rejected and will remain in the pending state. Only when the endpoint URL of the LIFF app is opened after the login process is complete, will the liff.init()
object either be resolved or rejected.
# Behavior based on screen size of the LIFF app
- If the screen size of the original LIFF app is set to
Tall
orCompact
, the browser will initially close regardless of the screen size of the LIFF app to which you want to move, before the destination LIFF app is displayed. - If the screen size of the original LIFF app is set to
Full
, the screen size of the destination LIFF app will be displayed inFull
, regardless of the destination LIFF app screen size specification. - If the screen size of the original LIFF app is set to
Full
and the screen size of the transition destination LIFF app isTall
orCompact
, the action button will not be displayed in the LIFF app after the transition.
# About the "chat_message.write" scope after transitioning between LIFF apps
The chat_message.write
scope after a transitioning between LIFF apps is enabled or disabled depending on the transition destination URL.
Transition destination URL | Example URL | The chat_message.write scope after transition |
---|---|---|
LIFF URL | https://liff.line.me/{liffId} | Enabled |
LIFF URL including additional information | https://liff.line.me/{liffId}/path_A/?key1=value1#URL-fragment | Enabled |
Endpoint URL | https://example.com | Disabled |
If the chat_message.write
scope is enabled, the liff.sendMessages()
method is available in the transition destination LIFF app.
# On LINE versions earlier than 12.13.0, the "chat_message.write" scope will be disabled
On LINE versions earlier than 12.13.0, after transitioning from LIFF A to LIFF B, the chat_message.write
scope will be disabled in LIFF B, and the channel consent screen won't be displayed either. Therefore, the liff.sendMessages()
method, which requires the chat_message.write
scope, will no longer be available in LIFF B.
# Get URL from before LIFF-to-LIFF transition
When you open a LIFF app during a LIFF-to-LIFF transition, the query parameter, liff.referrer
, will be given to the URL of the LIFF app after the transition. The value of liff.referrer
will be set to the percent-encoded (opens new window) URL of the address of the Referer
request header received by the LIFF server during the LIFF-to-LIFF transition. By checking the value of the liff.referrer
, you can get the URL before the transition.
The following is an example of how liff.referrer
is given during LIFF-to-LIFF transition.
LIFF app URL before transition | URL of the link | LIFF app URL after transition (after executing liff.init() method) | |
---|---|---|---|
Given | https://first.example.com/ | https://liff.line.me/{LIFF ID} (LIFF URL) | ✅ https://second.example.com/?liff.referrer=https%3A%2F%2Ffirst.example.com%2F *1 |
Not given | https://first.example.com/ | https://second.example.com/ (Endpoint URL) | ❌ https://second.example.com/ *2 |
*1 In addition to liff.referrer
, the liff.*
query parameter may be given to the LIFF app URL after the transition.
*2 If the endpoint URL of the LIFF app is opened directly, liff.referrer
will not be given.