Skip to content
This repository was archived by the owner on Dec 7, 2021. It is now read-only.

Commit b887f44

Browse files
authored
Merge pull request #48 from adamjmcgrath/oauth-login
Add android support
2 parents 50bcd9c + 0e6c26f commit b887f44

33 files changed

+3124
-318
lines changed

.babelrc

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
{
2+
"plugins": [
3+
"transform-es2015-modules-commonjs",
4+
"ramda-patch",
5+
"transform-object-rest-spread"
6+
]
7+
}

.editorconfig

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
# EditorConfig helps developers define and maintain consistent
2+
# coding styles between different editors and IDEs
3+
# editorconfig.org
4+
5+
root = true
6+
7+
8+
[*]
9+
10+
# Change these settings to your own preference
11+
indent_style = space
12+
indent_size = 2
13+
14+
# We recommend you to keep these unchanged
15+
end_of_line = lf
16+
charset = utf-8
17+
trim_trailing_whitespace = true
18+
insert_final_newline = true
19+
20+
[*.md]
21+
trim_trailing_whitespace = false

.eslintrc

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
{
2+
"extends": "airbnb",
3+
"env": {
4+
"browser": true,
5+
"node": true,
6+
"mocha": true
7+
},
8+
"plugins": [
9+
"import"
10+
],
11+
"rules": {
12+
"max-len": [2, 80, 2],
13+
"import/extensions": [0]
14+
}
15+
}

README.md

Lines changed: 81 additions & 65 deletions
Original file line numberDiff line numberDiff line change
@@ -1,98 +1,114 @@
11
# react-native-simple-auth [![Build Status](https://travis-ci.org/adamjmcgrath/react-native-simple-auth.svg?branch=chore%2Frelease-tasks)](https://travis-ci.org/adamjmcgrath/react-native-simple-auth)
2-
## [SimpleAuth iOS](https://github.com/calebd/SimpleAuth) wrapper for React Native
2+
3+
## OAuth login for React Native
34

45
* [Screencast](#screencast)
56
* [Install](#install)
7+
* [Providers Setup](#providers-setup)
68
* [Usage](#usage)
79
* [License](#license)
8-
* [Thanks](#thanks)
910

1011
Screencast
1112
==========
1213

13-
![Screencast](https://raw.githubusercontent.com/adamjmcgrath/react-native-simple-auth/master/screencast.gif)
14+
iOS | Android
15+
:-------------------------:|:-------------------------:
16+
![Screencast](https://raw.githubusercontent.com/adamjmcgrath/react-native-simple-auth/master/screencast-ios.gif) | ![Screencast](https://raw.githubusercontent.com/adamjmcgrath/react-native-simple-auth/master/screencast-android.gif)
1417

1518
Source of example app: https://github.com/adamjmcgrath/ReactNativeSimpleAuthExample
1619

1720
Install
1821
=======
19-
1. Install [react native](https://facebook.github.io/react-native/docs/getting-started.html#quick-start)
20-
2. `npm install react-native-simple-auth`
21-
3. In XCode, in the project navigator right click `Libraries``Add Files to [your project's name]`
22-
4. Go to `node_modules``react-native-simple-auth``ios` and add `SimpleAuthWrapper.h` and `SimpleAuthWrapper.m`
23-
5. Go to your project's root directory and add a Podfile similar to [this example](https://github.com/adamjmcgrath/ReactNativeSimpleAuthExample/blob/master/Podfile).
24-
6. Install CocoaPods https://guides.cocoapods.org/using/getting-started.html
25-
7. Run `pod install`
26-
27-
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.
22+
- `yarn add react-native-simple-auth`
23+
- 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))
24+
- Set up your OAuth Providers
25+
26+
Providers Setup
27+
===============
28+
29+
### Google
30+
- 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.
31+
- The "Bundle ID" should contain a dot, eg `com.reactnativesimpleauth`
32+
- 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
33+
```js
34+
{
35+
appId: '123-123abc.apps.googleusercontent.com',
36+
callback: 'com.reactnativesimpleauthexample:/oauth2redirect'
37+
}
38+
```
39+
- 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
40+
- Add the deep link scheme for the callback to your iOS app, eg https://dev.twitter.com/cards/mobile/url-schemes
41+
42+
### Facebook
43+
- Create an app on the [Facebook developers](https://developers.facebook.com) website
44+
- In `Settings`, click `Add Platform`
45+
- Select iOS, and in the `Bundle ID` field, add `fb{your App ID}` eg `fb1234567890` (You can use the same configuration for Android)
46+
- Your configuration object should contain the 'Appid ID' as `appId` and 'Bundle ID' in the `callback` (you must put `://authorize`), eg
47+
```js
48+
{
49+
appId: '1234567890',
50+
callback: 'fb1234567890://authorize',
51+
}
52+
```
53+
- 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
54+
- 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)
55+
56+
### Twitter
57+
- Create an app on https://apps.twitter.com
58+
- You can put any valid URL as the callback url.
59+
- 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
60+
```js
61+
{
62+
appId: 'abc1234567890',
63+
appSecret: 'cba0987654321',
64+
callback: 'testapp://authorize',
65+
}
66+
```
67+
- 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
68+
- 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)
69+
70+
### Tumblr
71+
- Create an app on https://www.tumblr.com/oauth/apps
72+
- You can put any valid URL as the callback url.
73+
- Your configuration object should contain the 'OAuth Consumer Key' as `appId`, the 'OAuth Consumer Secret' ass `appSecret` and any `callback`, eg
74+
```js
75+
{
76+
appId: '1234567890abc',
77+
appSecret: '1234567890abc',
78+
callback: 'testapp://authorize',
79+
}
80+
```
81+
- 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
82+
- 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)
2883

2984
Usage
3085
=====
3186

3287
Create a configuration object for each of the providers you want to authorize with (required keys are in parenthesis):
3388

34-
- google-web (`client_id`, `client_secret`)
35-
- facebook (`app_id`)
36-
- twitter (`consumer_key`, `consumer_secret`)
37-
- instagram (`client_id`, `redirect_uri`)
38-
- tumblr (`consumer_key`, `consumer_secret`)
39-
- linkedin-web (`client_id`, `client_secret`, `redirect_uri`)
89+
- google (`appId`, `callback`)
90+
- facebook (`appId`, `callback`)
91+
- twitter (`appId`, `appSecret`, `callback`)
92+
- tumblr (`appId`, `appSecret`, `callback`)
4093

4194
See [secrets.example.js](https://github.com/adamjmcgrath/ReactNativeSimpleAuthExample/blob/master/secrets.example.js).
4295

43-
[Other providers supported by SimpleAuth](https://github.com/calebd/SimpleAuth#simpleauth) may work, but haven't been tested.
44-
45-
Create an instance of the SimpleAuthWrapper library:
46-
47-
```javascript
48-
let simpleAuthClient = require('react-native-simple-auth');
49-
```
50-
51-
Configure the library with a single provider:
52-
5396
```javascript
54-
simpleAuthClient.configure('twitter', {
55-
consumer_key: 'KEY',
56-
consumer_secret: 'SECRET'
57-
}).then(() => {
58-
// Twitter is configured.
59-
})
60-
```
61-
62-
Or multiple providers:
63-
64-
```javascript
65-
simpleAuthClient.configure({
66-
twitter: {
67-
consumer_key: 'KEY',
68-
consumer_secret: 'SECRET'
69-
},
70-
facebook: {
71-
app_id: 'ID'
72-
}
73-
}).then(() => {
74-
// Twitter & Facebook are configured.
75-
});
76-
```
77-
78-
Then authorize each provider:
79-
80-
```javascript
81-
simpleAuthClient.authorize('twitter').then((info) => {
82-
let token = info.token;
83-
let name = info.name;
97+
import { google, facebook, twitter, tumblr } from 'react-native-simple-auth';
98+
99+
google({
100+
appId: '123-123abc.apps.googleusercontent.com',
101+
callback: 'com.reactnativesimpleauthexample:/oauth2redirect',
102+
}).then((info) => {
103+
// info.user - user details from the provider
104+
// info.credentials - tokens from the provider
84105
}).catch((error) => {
85-
let errorCode = error.code;
86-
let errorDescription = error.description;
106+
// error.code
107+
// error.description
87108
});
88109
```
89110

90111
License
91112
=======
92113

93114
react-native-simple-auth is released under the MIT license.
94-
95-
Thanks
96-
======
97-
98-
- [calebd](https://github.com/calebd) for the code review and [SimpleAuth](https://github.com/calebd/SimpleAuth) library

index.js

Lines changed: 13 additions & 110 deletions
Original file line numberDiff line numberDiff line change
@@ -1,116 +1,19 @@
1-
'use strict';
2-
3-
let SimpleAuthWrapper = require('react-native').NativeModules.SimpleAuthWrapper;
4-
51
/**
6-
* @class SimpleAuthClient
7-
*
8-
* Configure and authorize with various social API's.
2+
* Login with various social API's.
93
* Including: Google, Twitter, Facebook, Instagram, Tumblr & LinkedIn.
104
*/
11-
class SimpleAuthClient {
12-
13-
/**
14-
* Helper to configure the SimpleAuthWrapper for a given provider and config.
15-
* @param {string} provider
16-
* @param {Object} config
17-
* @returns {Promise}
18-
* @private
19-
*/
20-
_configure(provider, config) {
21-
return new Promise(function(resolve) {
22-
SimpleAuthWrapper.configure(provider, config, resolve);
23-
});
24-
}
25-
26-
/**
27-
* Configure the SimpleAuth client.
28-
*
29-
* You can either pass in a single provider and corresponding config or an
30-
* object provider id's as keys and configs as values.
31-
*
32-
* ### Usage:
33-
* #### Single provider:
34-
*
35-
* ```javascript
36-
*
37-
* let simpleAuthClient = new SimpleAuthClient();
38-
*
39-
* simpleAuthClient.configure('twitter', {
40-
* consumer_key: 'KEY',
41-
* consumer_secret: 'SECRET'
42-
* }).then(() => {
43-
* // Twitter is configured.
44-
* })```
45-
*
46-
* #### Multiple providers:
47-
*
48-
* ```javascript
49-
* simpleAuthClient.configure({
50-
* twitter: {
51-
* consumer_key: 'KEY',
52-
* consumer_secret: 'SECRET'
53-
* },
54-
* facebook: {
55-
* app_id: 'ID'
56-
* }
57-
* }).then(() => {
58-
* // Twitter & Facebook are configured.
59-
* });```
60-
*
61-
* You must do this and wait for the promise to resolve before you can
62-
* call authorize.
63-
*
64-
* @param {string|Object} provider Provider id (eg. 'twitter', 'facebook')
65-
* @param {Object} config
66-
* @returns {Promise}
67-
*/
68-
configure(provider, config) {
69-
// Expect provider, config if > 1 argument.
70-
if (arguments.length > 1) {
71-
return this._configure(provider, config);
72-
} else {
73-
config = arguments[0];
74-
return Promise.all(Object.keys(config).map(provider => {
75-
return this._configure(provider, config[provider]);
76-
}));
77-
}
78-
}
795

80-
/**
81-
* Authorizes a user with a given provider.
82-
*
83-
* ### Usage:
84-
*
85-
* ```javascript
86-
* simpleAuthClient.authorize('twitter').then((info) => {
87-
* let token = info.token;
88-
* let name = info.name;
89-
* }).catch((error) => {
90-
* let errorCode = error.code;
91-
* let errorDescription = error.description;
92-
* });```
93-
*
94-
* `authorize` returns an object with user info like name, url, and profile
95-
* pic and a token.
96-
*
97-
* @param {string} provider The provider id.
98-
* @returns {Promise}
99-
*/
100-
authorize(provider) {
101-
return new Promise((resolve, reject) => {
102-
SimpleAuthWrapper.authorize(provider, function(error, credentials, info) {
103-
if (error) {
104-
reject(error);
105-
} else {
106-
info.token = credentials.token;
107-
info.credentials = credentials;
108-
resolve(info)
109-
}
110-
});
111-
});
112-
}
6+
import { __ } from 'ramda';
7+
import login from './lib/login';
8+
import * as platform from './lib/platforms/react-native';
9+
import * as _google from './lib/providers/google';
10+
import * as _facebook from './lib/providers/facebook';
11+
import * as _twitter from './lib/providers/twitter';
12+
import * as _tumblr from './lib/providers/tumblr';
11313

114-
}
14+
export const google = login(_google, platform);
15+
export const facebook = login(_facebook, platform);
16+
export const twitter = login(_twitter, platform);
17+
export const tumblr = login(_tumblr, platform);
11518

116-
module.exports = new SimpleAuthClient();
19+
export default login(__, platform);

ios/SimpleAuthWrapper.h

Lines changed: 0 additions & 4 deletions
This file was deleted.

0 commit comments

Comments
 (0)