All Projects → xmartlabs → React Native Line

xmartlabs / React Native Line

Licence: mit
Line SDK wrapper for React Native 🚀

Programming Languages

typescript
32286 projects

Projects that are alternatives of or similar to React Native Line

Remodel
Data and class remodeling library
Stars: ✭ 63 (-21.25%)
Mutual labels:  wrapper
Uglifyjs Online
JavaScript minifier in the browser
Stars: ✭ 71 (-11.25%)
Mutual labels:  wrapper
Phenomenon Px
⚡️ The fastest way to create pixel shaders.
Stars: ✭ 77 (-3.75%)
Mutual labels:  wrapper
Domonit
A Deadly Simple Docker Monitoring Wrapper For Docker API
Stars: ✭ 67 (-16.25%)
Mutual labels:  wrapper
Hentai
Implements a wrapper class around nhentai's RESTful API.
Stars: ✭ 68 (-15%)
Mutual labels:  wrapper
Maker.js
📐⚙ 2D vector line drawing and shape modeling for CNC and laser cutters.
Stars: ✭ 1,185 (+1381.25%)
Mutual labels:  line
Rt Thread Wrapper Of Ucos Iii
RT-Thread操作系统的uCOS-III兼容层:让基于uC/OS-III操作系统开发的应用层无感地迁移到RT-Thread操作系统 | A wrapper which can make codes developed by uCOS-III APIs directly run on RT-Thread
Stars: ✭ 60 (-25%)
Mutual labels:  wrapper
Pswritecolor
Write-Color is a wrapper around Write-Host allowing you to create nice looking scripts, with colorized output.
Stars: ✭ 78 (-2.5%)
Mutual labels:  wrapper
Micro sparrow
语雀的第三方APP
Stars: ✭ 71 (-11.25%)
Mutual labels:  hybrid-apps
Line Bot Sdk Python
LINE Messaging API SDK for Python
Stars: ✭ 1,198 (+1397.5%)
Mutual labels:  line
D2sqlite3
A small wrapper around SQLite for the D programming language
Stars: ✭ 67 (-16.25%)
Mutual labels:  wrapper
Line Bot Sdk Perl
LINE Messaging API SDK for Perl
Stars: ✭ 69 (-13.75%)
Mutual labels:  line
Weexplus
🔨基于阿里WeexSDK跨平台方案,在原有的组件基础上,提供weex调用android native方法的一套扩展通信交互库,包含页面导航、数据存储、图片选择、二维码识别、权限等。
Stars: ✭ 73 (-8.75%)
Mutual labels:  hybrid-apps
Onsenui
Mobile app development framework and SDK using HTML5 and JavaScript. Create beautiful and performant cross-platform mobile apps. Based on Web Components, and provides bindings for Angular 1, 2, React and Vue.js.
Stars: ✭ 8,518 (+10547.5%)
Mutual labels:  hybrid-apps
Minecraft Wrapper
A simple & intuitive Minecraft Server wrapper. Supports IRC, backups, a plugin system, and more.
Stars: ✭ 77 (-3.75%)
Mutual labels:  wrapper
Vscode Surround
🔥A simple yet powerful extension to add wrapper templates around your code blocks
Stars: ✭ 60 (-25%)
Mutual labels:  wrapper
Swifttwitch
👾 The New Twitch API for iOS; wrapped in Swift goodness 👾
Stars: ✭ 72 (-10%)
Mutual labels:  wrapper
Uvw
Header-only, event based, tiny and easy to use libuv wrapper in modern C++ - now available as also shared/static library!
Stars: ✭ 1,222 (+1427.5%)
Mutual labels:  wrapper
Tortilla
Wrapping web APIs made easy.
Stars: ✭ 1,215 (+1418.75%)
Mutual labels:  wrapper
Csnackbar
This is a wrapper for android Snackbar. Which giving support to change Snackbar color, duration, message or even it's content view with a custom view.
Stars: ✭ 76 (-5%)
Mutual labels:  wrapper

React Native LINE

Line SDK wrapper for React Native 🚀

This library includes:

PRs Welcome All Contributors NPM Version

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.

Migration from v1.x.x

If you are currently using react-native-line-sdk (v1.x.x):

  1. Unlink the old library:
  react-native unlink react-native-line-sdk
  1. Remove it from the package.json
  2. Remove any line sdk's *.aar from android/libs
  3. Remove from android/app/build.gradle:
repositories {
    flatDir {
        dirs 'libs'
    }
}

Finally, follow the installation steps for the new version.

Installation

First, install the npm package with yarn. Autolink is automatic.

  yarn add @xmartlabs/react-native-line

iOS Setup

Using Objective-C

Inside your AppDelegate.m, setup the line sdk by passing the channel id obtained.

  1. Add platform :ios, '10.0' in Podfile line:1
  2. Enable use_frameworks! in Podfile line:3
  3. Comment the code related to flipper, flipper doesn't support use_frameworks! !
  4. Modify your info.plist like it says here Configuring the Info.plist file
  5. Change your AppDelegate.m to 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;
}

Using Swift

  1. Follow instructions in Integrating LINE Login with your iOS app.
  2. 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

  1. Follow all the configuration steps in Line's Android integration guide
  2. 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>
  1. Add minSdkVersion = 17 in android/build.gradle
  2. In your manifest add xmlns:tools="http://schemas.android.com/tools" in your manifest tag and also tools:replace="android:allowBackup" in your application tag

API

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.

Return values

The following objects are returned on the methods described above:

  1. 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
}
  1. 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
}
  1. 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
}
  1. 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
}
  1. BotFriendshipStatus
{
  friendFlag: boolean
}

Arguments

  1. LoginArguments
{
  scopes?: LoginPermission[]
  onlyWebLogin?: boolean
  botPrompt?: BotPrompt
}
  1. 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',
}
  1. BotPrompt
{
  aggressive = 'aggressive',
  normal = 'normal',
}

Usage

  1. Login with default values:
    try {
        ...
        const loginResult = await Line.login()
        ...
    } catch (error) {
        ...
    }
  1. Login with arguments:
    try {
        ...
        const loginResult = await Line.login({
          scopes: ['email', 'profile'],
          botPrompt: 'normal'
        })
        ...
    } catch (error) {
        ...
    }
  1. Get user profile:
    try {
        ...
        const profile = await Line.getProfile()
        ...
    } catch (error) {
        ...
    }
  1. Logout
    try {
        ...
        await Line.logout()
        ...
    } catch (error) {
        ...
    }

Example

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.

Contributors


Emiliano Botti

💻

Joaquín Aguirre

💻

Nicolas Hernandez

💻 👀

Santiago Fernández

📆 👀💻

Matías Irland

👀

License

@xmartlabs/react-native-line is available under the MIT license. See the LICENCE file for more info.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].