@yplabs-ltd/react-native-line
v1.0.3
Published
React Native Line wrapper
Downloads
24
Readme
This library includes:
- LINE SDK v5 for iOS Swift, wrapped with Swift.
- LINE SDK v5 for Android, wrapped with Kotlin.
Requirements
- React native
>=0.61.1
- iOS 10.0 or later as the development target
- Android
minSdkVersion
set to 17 or higher - LINE developer account with a channel created.
Installation
First, install the npm package with yarn. Autolink is automatic.
yarn add @yplabs-ltd/react-native-line
iOS Setup
Using Objective-C
Inside your AppDelegate.m
, setup the line sdk by passing the channel id obtained.
- Add
platform :ios, '10.0'
inPodfile
line:1 - Modify your info.plist like it says here Configuring the Info.plist file
- Change your
AppDelegate.m
to match the following:
// AppDelegate.m
//
// Import the Library
//
@import RNLine;
//
// 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;
}
Using Swift
- Follow instructions in Integrating LINE Login with your iOS app.
- Change your
AppDelegate.m
to 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.
Android Setup
- Follow all the configuration steps in Line's Android integration guide
- Add the string
line_channel_id
to 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 = 17
inandroid/build.gradle
- Add LineSDK as a dependency in
android/build.gradle
android {
// Enable Java 1.8 support.
compileOptions { // <- add this block if didn't setup
sourceCompatibility JavaVersion.VERSION_1_8
targetCompatibility JavaVersion.VERSION_1_8
}
...
dependencies {
...
implementation 'com.linecorp.linesdk:linesdk:5.7.0' // <- add this line
}
}
- In your manifest add
xmlns:tools="http://schemas.android.com/tools"
in yourmanifest
tag and alsotools:replace="android:allowBackup"
in yourapplication
tag
API
First, require the LineLogin
module:
import LineLogin from '@yplabs-ltd/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. |
Return values
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
}
Arguments
- 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',
}
Usage
- 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) {
...
}
Example
If you want to see @yplabs-ltd/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.