Name: react-native-meteor-oauth
Owner: TABLEFLIP
Description: Oauth2 login to a Meteor server in React Native
Created: 2016-10-21 15:46:18.0
Updated: 2018-01-11 18:30:55.0
Pushed: 2016-10-24 08:40:00.0
Homepage: null
Size: 17
Language: JavaScript
GitHub Committers
| User | Most Recent Commit | # Commits |
|---|
Other Committers
| User | Most Recent Commit | # Commits |
|---|
Oauth2 login to a Meteor server in React Native
rt React, { Component } from 'react'
rt View from 'react-native'
rt Meteor from 'react-native-meteor'
rt Login from 'react-native-meteor-oauth'
t meteorHost = '192.168.1.73:3000' // Put your local IP here if running in dev
or.connect(`ws://${meteorHost}/websocket`)
rt default () => {
turn (<View>
<Login
provider='Github'
callbackUrl='http://localhost:3000/_oauth/github'
meteorServerDomain={meteorHost}
meteorServerProtocol='http'
clientId='YOUR_GITHUB_CLIENT_ID'
/>
View>)
This module depends on react-native-meteor under the hood, which should then be used for subscriptions, method calling and so on once login has occurred.
The react-native-meteor docs specify that you should Meteor.connect only once in your app's parent component. The example above is reductive, but in a more realistic app this would involve having the Meteor.connect line in the parent component and requiring/using react-native-meter-oauth in subcomponents.
Currently: Github, Google and Facebook.
Any other provider which allow login with Oauth2 can easily be added, which unfortunately does not presently include Twitter.
provider (required): one of ["Github", "Google", "Facebook"] for automatic config, but can be anything if you supply url and possibly extraRequestParam (see below).clientId (required): the client ID given by the OAuth provider.callbackUrl (required): the callback URL you specified to the OAuth provider corresponding to this clientId.meteorServerDomain (required): the domain of the Meteor server you're intending to log in to. Note localhost:3000 will not work here, as a device (even running in an emulator) has to connect over the (local) network. Use your dev server's local IP in dev.meteorServerProtocol (required): either http or https.scope (optional): a space-delimited string of requested scopes. Sensible but limited defaults are provided.url (optional): the url you want to use to request authorization from the OAuth provider. Theoretically, this (along with the param below) allows you to connect to any arbitary provider.extraRequestParams (optional): a dictionary of extra parameters which need to be provided in the authorization request to make OAuth work. For example, Google requires response_type="code", but this is already set by default.styles (optional): a dictionary of styles to overwrite the defaults, which are as follows:
ttonContainer: { flexDirection: 'row', justifyContent: 'space-around' },
tton: { flex: -1 },
ttonLogin: { backgroundColor: '#bbb'},
ttonLogout: { backgroundColor: '#bbb'},
ttonLoginText: { textAlign: 'center', paddingVertical: 12, paddingHorizontal: 40 },
ttonLogoutText: { textAlign: 'center', paddingVertical: 12, paddingHorizontal: 40 },
xt: { textAlign: 'center', marginBottom: 15 },
ew: { flex: 1, alignSelf: 'stretch', justifyContent: 'center' }
Provider-specific styles are also merged into these for the Github, Google and Facebook.