Line SDK wrapper for React Native 🚀
This library includes:
- LINE SDK v5 for iOS Swift, wrapped with Swift.
- LINE SDK v5 for Android, wrapped with Kotlin.
- React native
>=0.61.1 - iOS 10.0 or later as the development target
- Android
minSdkVersionset to 17 or higher - LINE developer account with a channel created.
If you are currently using react-native-line-sdk (v1.x.x):
- Unlink the old library:
react-native unlink react-native-line-sdk - Remove it from the
package.json - Remove any line sdk's
*.aarfromandroid/libs - Remove from
android/app/build.gradle:
repositories { flatDir { dirs 'libs' } } Finally, follow the installation steps for the new version.
First, install the npm package with yarn. Autolink is automatic.
yarn add @xmartlabs/react-native-lineInside your AppDelegate.m, setup the line sdk by passing the channel id obtained.
- Add
platform :ios, '11.0'inPodfileline:1 - Modify your info.plist like it says here Configuring the Info.plist file
- Change your
AppDelegate.mto match the following:
// AppDelegate.m // // Import the Library // #import "RNLine-Swift.h" // // Setup the plugin using your CHANNEL_ID when the app finishes launching // - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions { [LineLogin setupWithChannelID:@"YOUR_CHANNEL_ID" universalLinkURL:nil]; } // // Handle redirection back to the app from Line // - (BOOL)application:(UIApplication *)app openURL:(NSURL *)url options:(NSDictionary<UIApplicationOpenURLOptionsKey,id> *)options { return [LineLogin application:app open:url options:options]; } - (BOOL)application:(UIApplication *)application continueUserActivity:(NSUserActivity *)userActivity restorationHandler:(void (^)(NSArray<id<UIUserActivityRestoring>> * _Nullable))restorationHandler { BOOL handledLine = [LineLogin application:application continue:userActivity restorationHandler:restorationHandler]; return handledLine; }- Follow instructions in Integrating LINE Login with your iOS app.
- Change your
AppDelegate.mto match the following:
// AppDelegate.swift // // Import the Library // import LineLogin // // Setup the plugin using your CHANNEL_ID when the app finishes launching // func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?) -> Bool { LineLogin.setup(channelID: "YOUR_CHANNEL_ID", universalLinkURL: nil) return true } // // Handle redirection back to the app from Line // func application(_ app: UIApplication, open url: URL, options: [UIApplication.OpenURLOptionsKey : Any] = [:]) -> Bool { return LineLogin.application(app, open: url, options: options) }Don't forget to add application function, as line's instructions indicate.
- Follow all the configuration steps in Line's Android integration guide
- Add the string
line_channel_idto your strings file with the the channel id that you have on your line console.
<string name="line_channel_id" translatable="false">Your channel id here</string>- Add
minSdkVersion = 17inandroid/build.gradle - In your manifest add
xmlns:tools="http://schemas.android.com/tools"in yourmanifesttag and alsotools:replace="android:allowBackup"in yourapplicationtag
First, require the LineLogin module:
import LineLogin from '@xmartlabs/react-native-line'Then, you can start using all the functions that are available:
| Function | Description |
|---|---|
login(args?: LoginArguments): Promise<LoginResult> | Starts the login flow of Line's SDK (Opens the apps if it's installed and defaults to the browser otherwise). It accepts the same argumements as the LineSDK, in an object { key: value }, defaults the same way as LineSDK too. |
getCurrentAccessToken(): Promise<AccessToken> | Returns the current access token for the currently logged in user. |
getProfile(): Promise<UserProfile> | Returns the profile of the currently logged in user. |
logout(): Promise<void> | Logs out the currently logged in user. |
refreshToken(): Promise<AccessToken> | Refreshes the access token and returns it. |
verifyAccessToken(): Promise<AccessTokenVerifyResult> | Verifies the access token and returns it. |
getBotFriendshipStatus(): Promise<BotFriendshipStatus> | Gets bot friendship status if configured. |
The following objects are returned on the methods described above:
- UserProfile:
{ /// The user ID of the current authorized user. userID: String /// The display name of the current authorized user. displayName: string /// The profile image URL of the current authorized user. `null` if the user has not set a profile /// image. pictureURL?: string /// The status message of the current authorized user. `null` if the user has not set a status message. statusMessage?: string }- AccessToken:
{ /// The value of the access token. access_token: String /// The expiration time of the access token. It is calculated using `createdAt` and the validity period /// of the access token. This value might not be the actual expiration time because this value depends /// on the system time of the device when `createdAt` is determined. expires_in: String /// The raw string value of the ID token bound to the access token. The value exists only if the access token /// is obtained with the `.openID` permission. id_token?: String }- AccessTokenVerifyResult:
{ // The channel ID bound to the access token. client_id: String /// The amount of time until the access token expires. expires_in: String /// Valid permissions of the access token separated by spaces scope: String }- LoginResult
{ /// The access token obtained by the login process. accessToken: AccessToken /// The permissions bound to the `accessToken` object by the authorization process. Scope has them separated by spaces scope: String /// Contains the user profile including the user ID, display name, and so on. The value exists only when the /// `.profile` permission is set in the authorization request. userProfile?: UserProfile /// Indicates that the friendship status between the user and the bot changed during the login. This value is /// non-`null` only if the `.botPromptNormal` or `.botPromptAggressive` are specified as part of the /// `LoginManagerOption` object when the user logs in. For more information, see Linking a bot with your LINE /// Login channel at https://developers.line.me/en/docs/line-login/web/link-a-bot/. friendshipStatusChanged?: boolean /// The `nonce` value when requesting ID Token during login process. Use this value as a parameter when you /// verify the ID Token against the LINE server. This value is `null` if `.openID` permission is not requested. IDTokenNonce?: String }- BotFriendshipStatus
{ friendFlag: boolean }- LoginArguments
{ scopes?: LoginPermission[] onlyWebLogin?: boolean botPrompt?: BotPrompt }- LoginPermission
{ EMAIL = 'email', /// The permission to get an ID token in the login response. OPEN_ID = 'openid', /// The permission to get the user's profile including the user ID, display name, and the profile image /// URL in the login response. PROFILE = 'profile', }- BotPrompt
{ aggressive = 'aggressive', normal = 'normal', }- Login with default values:
try { ... const loginResult = await Line.login() ... } catch (error) { ... }- Login with arguments:
try { ... const loginResult = await Line.login({ scopes: ['email', 'profile'], botPrompt: 'normal' }) ... } catch (error) { ... }- Get user profile:
try { ... const profile = await Line.getProfile() ... } catch (error) { ... }- Logout
try { ... await Line.logout() ... } catch (error) { ... }If you want to see @xmartlabs/react-native-line in action, just move into the example folder and run yarn ios/yarn android. By seeing its source code, you will have a better understanding of the library usage.
 Emiliano Botti 💻 |  Joaquín Aguirre 💻 |  Nicolas Hernandez 💻 👀 |  Santiago Fernández 📆 👀💻 |  Matías Irland 👀 |
@xmartlabs/react-native-line is available under the MIT license. See the LICENCE file for more info.