[js][storage] uploadTask.on now correctly handles next or observer args as per firebase web sdk

This commit is contained in:
Salakar 2017-04-07 16:15:08 +01:00
commit 9031db6b64
4 changed files with 87 additions and 69 deletions

View File

@ -1,6 +1,6 @@
# Authentication
RNFirebase handles authentication for us out of the box, both with email/password-based authentication and through oauth providers (with a separate library to handle oauth providers).
RNFirebase handles authentication for us out of the box, both with email/password-based authentication and through oauth providers (with a separate library to handle oauth providers, see [examples](#examples)).
> Authentication requires Google Play services to be installed on Android.
@ -284,3 +284,40 @@ firebase.auth().currentUser
.then()
.catch();
```
## Examples
### Facebook authentication with react-native-fbsdk and signInWithCredential
```javascript
import { AccessToken, LoginManager } from 'react-native-fbsdk';
// ... somewhere in your login screen component
LoginManager
.logInWithReadPermissions(['public_profile', 'email'])
.then((result) => {
if (result.isCancelled) {
return Promise.resolve('cancelled');
}
console.log(`Login success with permissions: ${result.grantedPermissions.toString()}`);
// get the access token
const data = AccessToken.getCurrentAccessToken();
// create a new firebase credential with the token
const credential = firebase.auth.FacebookAuthProvider.credential(data.accessToken);
// login with credential
return firebase.auth().signInWithCredential(credential);
})
.then((currentUser) => {
if (currentUser === 'cancelled') {
console.log('Login cancelled');
} else {
// now signed in
console.warn(JSON.stringify(currentUser.toJSON()));
}
})
.catch((error) => {
console.log(`Login fail with error: ${error}`);
});
```

View File

@ -10,42 +10,11 @@ Each platform uses a different setup method after creating the project.
## iOS
After creating a Firebase project, click on the [Add Firebase to your iOS app](http://d.pr/i/3sEL.png) and follow the steps from there to add the configuration file. You do _not_ need to set up a cocoapods project (this is already done through RNFirebase). Make sure not to forget the `Copy Files` phase in iOS.
[Download the Firebase config file](https://support.google.com/firebase/answer/7015592) and place it in your app directory next to your app source code:
![GoogleService-Info.plist](http://d.pr/i/1eGev.png)
Once you download the configuration file, make sure you place it in the root of your Xcode project. Every different Bundle ID (aka, even different project variants needs their own configuration file).
Lastly, due to some dependencies requirements, RNFirebase supports iOS versions 8.0 and up. Make sure to update the minimum version of your iOS app to `8.0`.
See the [ios setup guide](./installation.ios.md).
## Android
There are several ways to setup Firebase on Android. The _easiest_ way is to pass the configuration settings in JavaScript. In that way, there is no setup for the native platform.
### google-services.json setup
If you prefer to include the default settings in the source of your app, download the `google-services.json` file provided by Firebase in the _Add Firebase to Android_ platform menu in your Firebase configuration console.
Next you'll have to add the google-services gradle plugin in order to parse it.
Add the google-services gradle plugin as a dependency in the *project* level build.gradle
`android/build.gradle`
```java
buildscript {
// ...
dependencies {
// ...
classpath 'com.google.gms:google-services:3.0.0'
}
}
```
In your app build.gradle file, add the gradle plugin at the VERY BOTTOM of the file (below all dependencies)
`android/app/build.gradle`
```java
apply plugin: 'com.google.gms.google-services'
```
See the [android setup guide](./installation.android.md).
## Usage
@ -58,32 +27,28 @@ import RNFirebase from 'react-native-firebase'
We need to tell the Firebase library we want to _configure_ the project. RNFirebase provides a way to configure both the native and the JavaScript side of the project at the same time with a single command:
```javascript
const firebase = new RNFirebase();
const firebase = RNFirebase.initializeApp({
// config options
});
```
We can pass _custom_ options by passing an object with configuration options. The configuration object will be generated first by the native configuration object, if set and then will be overridden if passed in JS. That is, all of the following key/value pairs are optional if the native configuration is set.
### Configuration Options
| option | type | Default Value | Description |
|----------------|----------|-------------------------|----------------------------------------|
| debug | bool | false | When set to true, RNFirebase will log messages to the console and fire `debug` events we can listen to in `js` |
| persistence | bool | false | When set to true, database persistence will be enabled. |
| bundleID | string | Default from app `[NSBundle mainBundle]` | The bundle ID for the app to be bundled with |
| googleAppID | string | "" | The Google App ID that is used to uniquely identify an instance of an app. |
| databaseURL | string | "" | The database root (i.e. https://my-app.firebaseio.com) |
| deepLinkURLScheme | string | "" | URL scheme to set up durable deep link service |
| storageBucket | string | "" | The Google Cloud storage bucket name |
| androidClientID | string | "" | The Android client ID used in Google AppInvite when an iOS app has it's android version |
| GCMSenderID | string | "" | The Project number from the Google Developer's console used to configure Google Cloud Messaging |
| trackingID | string | "" | The tracking ID for Google Analytics |
| clientID | string | "" | The OAuth2 client ID for iOS application used to authenticate Google Users for signing in with Google |
| APIKey | string | "" | The secret iOS API key used for authenticating requests from our app |
For instance:
```javascript
import RNFirebase from 'react-native-firebase';
const configurationOptions = {
debug: true
};
const firebase = new RNFirebase(configurationOptions);
firebase.on('debug', msg => console.log('Received debug message', msg))
const firebase = RNFirebase.initializeApp(configurationOptions);
export default firebase;
```

View File

@ -1,14 +1,31 @@
# Android Installation
The simplest way of installing on Android is to use the react-native link CLI command & rebuild the project:
### 1 - Setup google-services.json
Download the `google-services.json` file provided by Firebase in the _Add Firebase to Android_ platform menu in your Firebase configuration console. This file should be downloaded to `YOUR_PROJECT/android/app/google-services.json`.
```
react-native link react-native-firebase
Next you'll have to add the google-services gradle plugin in order to parse it.
Add the google-services gradle plugin as a dependency in the *project* level build.gradle
`android/build.gradle`
```java
buildscript {
// ...
dependencies {
// ...
classpath 'com.google.gms:google-services:3.0.0'
}
}
```
## Manually
In your app build.gradle file, add the gradle plugin at the VERY BOTTOM of the file (below all dependencies)
`android/app/build.gradle`
```java
apply plugin: 'com.google.gms.google-services'
```
To install `react-native-firebase` manually in our project, we'll need to import the package from `io.invertase.firebase` in our project's `android/app/src/main/java/com/[app name]/MainApplication.java` and list it as a package for ReactNative in the `getPackages()` function:
### 2 - Link RNFirebase
To install `react-native-firebase` in your project, you'll need to import the package from `io.invertase.firebase` in your project's `android/app/src/main/java/com/[app name]/MainApplication.java` and list it as a package for ReactNative in the `getPackages()` function:
```java
package com.youcompany.application;
@ -29,8 +46,7 @@ public class MainApplication extends Application implements ReactApplication {
// ...
}
```
We'll also need to list it in our `android/app/build.gradle` file as a dependency that we want React Native to compile. In the `dependencies` listing, add the `compile` line:
You'll also need to list it in our `android/app/build.gradle` file as a dependency that we want React Native to compile. In the `dependencies` listing, add the `compile` line:
```java
dependencies {
@ -45,6 +61,8 @@ include ':react-native-firebase'
project(':react-native-firebase').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-firebase/android')
```
### 3 - Cloud Messaging (optional)
If you plan on using [Firebase Cloud Messaging](https://firebase.google.com/docs/cloud-messaging/), add the following to `android/app/src/main/AndroidManifest.xml`.
Add permissions:

View File

@ -1,12 +1,10 @@
# iOS Installation
## iOS Installation
## Firebase
### 1 - Setup google-services.plist and dependencies
Setup the `google-services.plist` file and Firebase ios frameworks first; check out the relevant Firebase docs [here](https://firebase.google.com/docs/ios/setup#frameworks).
### Setup
Setup the Firebase ios frameworks first; check out the relevant Firebase docs [here](https://firebase.google.com/docs/ios/setup#frameworks).
### Initialisation
You need to add the following to the top of `ios/[YOUR APP NAME]]/AppDelegate.m`:
#### 1.1 - Initialisation
Make sure you've added the following to the top of your `ios/[YOUR APP NAME]]/AppDelegate.m` file:
`#import <Firebase.h>`
@ -14,14 +12,14 @@ and this to the `didFinishLaunchingWithOptions:(NSDictionary *)launchOptions` me
`[FIRApp configure];`
## RNFirebase
There are multiple ways to install RNFirebase dependent on how your project is currently setup:
### 2 - Link RNFirebase
There are multiple ways to install RNFirebase depending on how your project is currently setup:
### 1) Existing Cocoapods setup, including React Native as a pod
#### 2.1 - Existing Cocoapods setup, including React Native as a pod
Simply add the following to your `Podfile`:
```ruby
# Required by RNFirebase
# Required by RNFirebase - you should already have some of these from step 1.
pod 'Firebase/Auth'
pod 'Firebase/Analytics'
pod 'Firebase/AppIndexing'
@ -35,7 +33,7 @@ pod 'Firebase/Storage'
pod 'RNFirebase', :path => '../node_modules/react-native-firebase'
```
### 2) Automatically with react-native-cli
#### 2.2 - Via react-native-cli link
React native ships with a `link` command that can be used to link the projects together, which can help automate the process of linking our package environments.
```bash
@ -48,12 +46,12 @@ Update the newly installed pods once the linking is done:
cd ios && pod update --verbose
```
#### cocoapods
##### cocoapods
We've automated the process of setting up with cocoapods. This will happen automatically upon linking the package with `react-native-cli`.
**Remember to use the `ios/[YOUR APP NAME].xcworkspace` instead of the `ios/[YOUR APP NAME].xcproj` file from now on**.
### 3) Manually
#### 2.3 - Manually
If you prefer not to use `react-native link`, we can manually link the package together with the following steps, after `npm install`: