This repository has been archived by the owner on Dec 7, 2021. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 104
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #48 from adamjmcgrath/oauth-login
Add android support
- Loading branch information
Showing
33 changed files
with
3,124 additions
and
318 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,7 @@ | ||
| { | ||
| "plugins": [ | ||
| "transform-es2015-modules-commonjs", | ||
| "ramda-patch", | ||
| "transform-object-rest-spread" | ||
| ] | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,21 @@ | ||
| # EditorConfig helps developers define and maintain consistent | ||
| # coding styles between different editors and IDEs | ||
| # editorconfig.org | ||
|
|
||
| root = true | ||
|
|
||
|
|
||
| [*] | ||
|
|
||
| # Change these settings to your own preference | ||
| indent_style = space | ||
| indent_size = 2 | ||
|
|
||
| # We recommend you to keep these unchanged | ||
| end_of_line = lf | ||
| charset = utf-8 | ||
| trim_trailing_whitespace = true | ||
| insert_final_newline = true | ||
|
|
||
| [*.md] | ||
| trim_trailing_whitespace = false |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,15 @@ | ||
| { | ||
| "extends": "airbnb", | ||
| "env": { | ||
| "browser": true, | ||
| "node": true, | ||
| "mocha": true | ||
| }, | ||
| "plugins": [ | ||
| "import" | ||
| ], | ||
| "rules": { | ||
| "max-len": [2, 80, 2], | ||
| "import/extensions": [0] | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,98 +1,114 @@ | ||
| # react-native-simple-auth [](https://travis-ci.org/adamjmcgrath/react-native-simple-auth) | ||
| ## [SimpleAuth iOS](https://github.com/calebd/SimpleAuth) wrapper for React Native | ||
|
|
||
| ## OAuth login for React Native | ||
|
|
||
| * [Screencast](#screencast) | ||
| * [Install](#install) | ||
| * [Providers Setup](#providers-setup) | ||
| * [Usage](#usage) | ||
| * [License](#license) | ||
| * [Thanks](#thanks) | ||
|
|
||
| Screencast | ||
| ========== | ||
|
|
||
|  | ||
| iOS | Android | ||
| :-------------------------:|:-------------------------: | ||
|  |  | ||
|
|
||
| Source of example app: https://github.com/adamjmcgrath/ReactNativeSimpleAuthExample | ||
|
|
||
| Install | ||
| ======= | ||
| 1. Install [react native](https://facebook.github.io/react-native/docs/getting-started.html#quick-start) | ||
| 2. `npm install react-native-simple-auth` | ||
| 3. In XCode, in the project navigator right click `Libraries` ➜ `Add Files to [your project's name]` | ||
| 4. Go to `node_modules` ➜ `react-native-simple-auth`➜ `ios` and add `SimpleAuthWrapper.h` and `SimpleAuthWrapper.m` | ||
| 5. Go to your project's root directory and add a Podfile similar to [this example](https://github.com/adamjmcgrath/ReactNativeSimpleAuthExample/blob/master/Podfile). | ||
| 6. Install CocoaPods https://guides.cocoapods.org/using/getting-started.html | ||
| 7. Run `pod install` | ||
|
|
||
| If you encounter problems building the project after this, the [following install tips](https://github.com/adamjmcgrath/react-native-simple-auth/issues/14) may be of help. | ||
| - `yarn add react-native-simple-auth` | ||
| - Set up deep linking for your Android and iOS application using the instructions on the [react-native website](https://facebook.github.io/react-native/docs/linking.html) (set the `launchMode` of `MainActivity` to `singleTask` in `AndroidManifest.xml`, create the deep link schemes in [Providers Setup](#providers-setup)) | ||
| - Set up your OAuth Providers | ||
|
|
||
| Providers Setup | ||
| =============== | ||
|
|
||
| - Go to the [developer console](https://console.cloud.google.com/apis/credentials/oauthclient/) and create credentials for an iOS application (you can also use these for your Android app). More [instructions](https://support.google.com/cloud/answer/6158849) on the Google support site. | ||
| - The "Bundle ID" should contain a dot, eg `com.reactnativesimpleauth` | ||
| - Your configuration object should contain the 'Client ID' as `appId` and 'Bundle ID' in the `callback` (note the single `/`, you can put anything as the path), eg | ||
| ```js | ||
| { | ||
| appId: '123-123abc.apps.googleusercontent.com', | ||
| callback: 'com.reactnativesimpleauthexample:/oauth2redirect' | ||
| } | ||
| ``` | ||
| - Add the deep link scheme for the callback (Your Bundle ID, eg `com.reactnativesimpleauthexample`) to your `AndroidManifest.xml` eg https://github.com/adamjmcgrath/ReactNativeSimpleAuthExample/blob/master/android/app/src/main/AndroidManifest.xml#L28-L33 | ||
| - Add the deep link scheme for the callback to your iOS app, eg https://dev.twitter.com/cards/mobile/url-schemes | ||
|
|
||
| - Create an app on the [Facebook developers](https://developers.facebook.com) website | ||
| - In `Settings`, click `Add Platform` | ||
| - Select iOS, and in the `Bundle ID` field, add `fb{your App ID}` eg `fb1234567890` (You can use the same configuration for Android) | ||
| - Your configuration object should contain the 'Appid ID' as `appId` and 'Bundle ID' in the `callback` (you must put `://authorize`), eg | ||
| ```js | ||
| { | ||
| appId: '1234567890', | ||
| callback: 'fb1234567890://authorize', | ||
| } | ||
| ``` | ||
| - Add the deep link scheme for the callback (Your Bundle ID, eg `fb1234567890`) to your `AndroidManifest.xml` eg https://github.com/adamjmcgrath/ReactNativeSimpleAuthExample/blob/master/android/app/src/main/AndroidManifest.xml#L28-L33 | ||
| - Add the deep link scheme for the callback to your iOS app, eg https://dev.twitter.com/cards/mobile/url-schemes (Due to A Facebook bug, this should always be the top one in the list) | ||
|
|
||
| - Create an app on https://apps.twitter.com | ||
| - You can put any valid URL as the callback url. | ||
| - Your configuration object should contain the 'Consumer Key (API Key)' as `appId`, the 'Consumer Secret' ass `appSecret` and the Twitter `App name` in the `callback`, eg | ||
| ```js | ||
| { | ||
| appId: 'abc1234567890', | ||
| appSecret: 'cba0987654321', | ||
| callback: 'testapp://authorize', | ||
| } | ||
| ``` | ||
| - Add the deep link scheme for the callback (Your App Name, eg `testapp`) to your `AndroidManifest.xml` eg https://github.com/adamjmcgrath/ReactNativeSimpleAuthExample/blob/master/android/app/src/main/AndroidManifest.xml#L28-L33 | ||
| - Add the deep link scheme for the callback to your iOS app, eg https://dev.twitter.com/cards/mobile/url-schemes (Due to A Facebook bug, this should always be the top one in the list) | ||
|
|
||
| ### Tumblr | ||
| - Create an app on https://www.tumblr.com/oauth/apps | ||
| - You can put any valid URL as the callback url. | ||
| - Your configuration object should contain the 'OAuth Consumer Key' as `appId`, the 'OAuth Consumer Secret' ass `appSecret` and any `callback`, eg | ||
| ```js | ||
| { | ||
| appId: '1234567890abc', | ||
| appSecret: '1234567890abc', | ||
| callback: 'testapp://authorize', | ||
| } | ||
| ``` | ||
| - Add the deep link scheme for the callback (Your App Name, eg `testapp`) to your `AndroidManifest.xml` eg https://github.com/adamjmcgrath/ReactNativeSimpleAuthExample/blob/master/android/app/src/main/AndroidManifest.xml#L28-L33 | ||
| - Add the deep link scheme for the callback to your iOS app, eg https://dev.twitter.com/cards/mobile/url-schemes (Due to A Facebook bug, this should always be the top one in the list) | ||
|
|
||
| Usage | ||
| ===== | ||
|
|
||
| Create a configuration object for each of the providers you want to authorize with (required keys are in parenthesis): | ||
|
|
||
| - google-web (`client_id`, `client_secret`) | ||
| - facebook (`app_id`) | ||
| - twitter (`consumer_key`, `consumer_secret`) | ||
| - instagram (`client_id`, `redirect_uri`) | ||
| - tumblr (`consumer_key`, `consumer_secret`) | ||
| - linkedin-web (`client_id`, `client_secret`, `redirect_uri`) | ||
| - google (`appId`, `callback`) | ||
| - facebook (`appId`, `callback`) | ||
| - twitter (`appId`, `appSecret`, `callback`) | ||
| - tumblr (`appId`, `appSecret`, `callback`) | ||
|
|
||
| See [secrets.example.js](https://github.com/adamjmcgrath/ReactNativeSimpleAuthExample/blob/master/secrets.example.js). | ||
|
|
||
| [Other providers supported by SimpleAuth](https://github.com/calebd/SimpleAuth#simpleauth) may work, but haven't been tested. | ||
|
|
||
| Create an instance of the SimpleAuthWrapper library: | ||
|
|
||
| ```javascript | ||
| let simpleAuthClient = require('react-native-simple-auth'); | ||
| ``` | ||
|
|
||
| Configure the library with a single provider: | ||
|
|
||
| ```javascript | ||
| simpleAuthClient.configure('twitter', { | ||
| consumer_key: 'KEY', | ||
| consumer_secret: 'SECRET' | ||
| }).then(() => { | ||
| // Twitter is configured. | ||
| }) | ||
| ``` | ||
|
|
||
| Or multiple providers: | ||
|
|
||
| ```javascript | ||
| simpleAuthClient.configure({ | ||
| twitter: { | ||
| consumer_key: 'KEY', | ||
| consumer_secret: 'SECRET' | ||
| }, | ||
| facebook: { | ||
| app_id: 'ID' | ||
| } | ||
| }).then(() => { | ||
| // Twitter & Facebook are configured. | ||
| }); | ||
| ``` | ||
|
|
||
| Then authorize each provider: | ||
|
|
||
| ```javascript | ||
| simpleAuthClient.authorize('twitter').then((info) => { | ||
| let token = info.token; | ||
| let name = info.name; | ||
| import { google, facebook, twitter, tumblr } from 'react-native-simple-auth'; | ||
|
|
||
| google({ | ||
| appId: '123-123abc.apps.googleusercontent.com', | ||
| callback: 'com.reactnativesimpleauthexample:/oauth2redirect', | ||
| }).then((info) => { | ||
| // info.user - user details from the provider | ||
| // info.credentials - tokens from the provider | ||
| }).catch((error) => { | ||
| let errorCode = error.code; | ||
| let errorDescription = error.description; | ||
| // error.code | ||
| // error.description | ||
| }); | ||
| ``` | ||
|
|
||
| License | ||
| ======= | ||
|
|
||
| react-native-simple-auth is released under the MIT license. | ||
|
|
||
| Thanks | ||
| ====== | ||
|
|
||
| - [calebd](https://github.com/calebd) for the code review and [SimpleAuth](https://github.com/calebd/SimpleAuth) library |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,116 +1,19 @@ | ||
| 'use strict'; | ||
|
|
||
| let SimpleAuthWrapper = require('react-native').NativeModules.SimpleAuthWrapper; | ||
|
|
||
| /** | ||
| * @class SimpleAuthClient | ||
| * | ||
| * Configure and authorize with various social API's. | ||
| * Login with various social API's. | ||
| * Including: Google, Twitter, Facebook, Instagram, Tumblr & LinkedIn. | ||
| */ | ||
| class SimpleAuthClient { | ||
|
|
||
| /** | ||
| * Helper to configure the SimpleAuthWrapper for a given provider and config. | ||
| * @param {string} provider | ||
| * @param {Object} config | ||
| * @returns {Promise} | ||
| * @private | ||
| */ | ||
| _configure(provider, config) { | ||
| return new Promise(function(resolve) { | ||
| SimpleAuthWrapper.configure(provider, config, resolve); | ||
| }); | ||
| } | ||
|
|
||
| /** | ||
| * Configure the SimpleAuth client. | ||
| * | ||
| * You can either pass in a single provider and corresponding config or an | ||
| * object provider id's as keys and configs as values. | ||
| * | ||
| * ### Usage: | ||
| * #### Single provider: | ||
| * | ||
| * ```javascript | ||
| * | ||
| * let simpleAuthClient = new SimpleAuthClient(); | ||
| * | ||
| * simpleAuthClient.configure('twitter', { | ||
| * consumer_key: 'KEY', | ||
| * consumer_secret: 'SECRET' | ||
| * }).then(() => { | ||
| * // Twitter is configured. | ||
| * })``` | ||
| * | ||
| * #### Multiple providers: | ||
| * | ||
| * ```javascript | ||
| * simpleAuthClient.configure({ | ||
| * twitter: { | ||
| * consumer_key: 'KEY', | ||
| * consumer_secret: 'SECRET' | ||
| * }, | ||
| * facebook: { | ||
| * app_id: 'ID' | ||
| * } | ||
| * }).then(() => { | ||
| * // Twitter & Facebook are configured. | ||
| * });``` | ||
| * | ||
| * You must do this and wait for the promise to resolve before you can | ||
| * call authorize. | ||
| * | ||
| * @param {string|Object} provider Provider id (eg. 'twitter', 'facebook') | ||
| * @param {Object} config | ||
| * @returns {Promise} | ||
| */ | ||
| configure(provider, config) { | ||
| // Expect provider, config if > 1 argument. | ||
| if (arguments.length > 1) { | ||
| return this._configure(provider, config); | ||
| } else { | ||
| config = arguments[0]; | ||
| return Promise.all(Object.keys(config).map(provider => { | ||
| return this._configure(provider, config[provider]); | ||
| })); | ||
| } | ||
| } | ||
|
|
||
| /** | ||
| * Authorizes a user with a given provider. | ||
| * | ||
| * ### Usage: | ||
| * | ||
| * ```javascript | ||
| * simpleAuthClient.authorize('twitter').then((info) => { | ||
| * let token = info.token; | ||
| * let name = info.name; | ||
| * }).catch((error) => { | ||
| * let errorCode = error.code; | ||
| * let errorDescription = error.description; | ||
| * });``` | ||
| * | ||
| * `authorize` returns an object with user info like name, url, and profile | ||
| * pic and a token. | ||
| * | ||
| * @param {string} provider The provider id. | ||
| * @returns {Promise} | ||
| */ | ||
| authorize(provider) { | ||
| return new Promise((resolve, reject) => { | ||
| SimpleAuthWrapper.authorize(provider, function(error, credentials, info) { | ||
| if (error) { | ||
| reject(error); | ||
| } else { | ||
| info.token = credentials.token; | ||
| info.credentials = credentials; | ||
| resolve(info) | ||
| } | ||
| }); | ||
| }); | ||
| } | ||
| import { __ } from 'ramda'; | ||
| import login from './lib/login'; | ||
| import * as platform from './lib/platforms/react-native'; | ||
| import * as _google from './lib/providers/google'; | ||
| import * as _facebook from './lib/providers/facebook'; | ||
| import * as _twitter from './lib/providers/twitter'; | ||
| import * as _tumblr from './lib/providers/tumblr'; | ||
|
|
||
| } | ||
| export const google = login(_google, platform); | ||
| export const facebook = login(_facebook, platform); | ||
| export const twitter = login(_twitter, platform); | ||
| export const tumblr = login(_tumblr, platform); | ||
|
|
||
| module.exports = new SimpleAuthClient(); | ||
| export default login(__, platform); |
This file was deleted.
Oops, something went wrong.
Oops, something went wrong.