🔑 Keychain Access for React Native
Go to file
Vojtech Novak 008ee03b76 Update README.md (#20)
this one detail...
2016-06-01 01:52:10 +02:00
KeychainExample RN 0.10.0-rc support. 2015-08-16 23:00:19 +02:00
RNKeychain.xcodeproj Added project structure. 2015-05-20 18:23:04 +02:00
RNKeychainManager Added generic password support. 2015-05-29 18:25:56 +02:00
android Added Android support w/ Facebook Conceal (#19) 2016-06-01 00:25:51 +02:00
.editorconfig Added first implementation. 2015-05-20 20:39:52 +02:00
.flowconfig Added Android support w/ Facebook Conceal (#19) 2016-06-01 00:25:51 +02:00
.gitignore Added project structure. 2015-05-20 18:23:04 +02:00
.npmignore Removes KeychainExample from npm #15 2016-01-19 11:17:53 -06:00
LICENSE Initial commit 2015-05-20 17:33:48 +02:00
README.md Update README.md (#20) 2016-06-01 01:52:10 +02:00
RNKeychain.podspec Released 0.2.7. 2016-01-19 11:20:39 -06:00
index.js Added Android support w/ Facebook Conceal (#19) 2016-06-01 00:25:51 +02:00
package.json Released 0.3.0. 2016-06-01 00:30:18 +02:00

README.md

react-native-keychain

Keychain Access for React Native

Currently functionality is limited to just storing internet and generic passwords.

Installation

$ npm install react-native-keychain

Option: Manually

  • Right click on Libraries, select Add files to "…" and select node_modules/react-native-keychain/RNKeychain.xcodeproj
  • Select your project and under Build Phases -> Link Binary With Libraries, press the + and select libRNKeychain.a.

Option: With CocoaPods

Add the following to your Podfile and run pod update:

pod 'RNKeychain', :path => 'node_modules/react-native-keychain'

Option: With rnpm

$ rnpm link

Usage

See KeychainExample for fully working project example.

var Keychain = require('react-native-keychain');

var username = 'zuck';
var password = 'poniesRgr8';

// Generic Password, service argument optional
Keychain
  .setGenericPassword(username, password)
  .then(function() {
    console.log('Credentials saved successfully!');
  });

Keychain
  .getGenericPassword()
  .then(function(credentials) {
    console.log('Credentials successfully loaded for user ' + credentials.username);
  });

Keychain
  .resetGenericPassword()
  .then(function() {
    console.log('Credentials successfully deleted');
  });

// Internet Password, server argument required
var server = 'http://facebook.com';
Keychain
  .setInternetCredentials(server, username, password)
  .then(function() {
    console.log('Credentials saved successfully!');
  });

Keychain
  .getInternetCredentials(server)
  .then(function(credentials) {
    console.log('Credentials successfully loaded for user ' + credentials.username);
  });

Keychain
  .resetInternetCredentials(server)
  .then(function() {
    console.log('Credentials successfully deleted');
  });

Android

  • Note: Android support requires React Native 0.19 or later

  • on Android, the *InternetCredentials calls will be resolved as calls to *GenericPassword() and the data will be saved in SharedPreferences, encrypted using Facebook conceal.

  • Edit android/settings.gradle to look like this (without the +):

    rootProject.name = 'MyApp'
    
    include ':app'
    
    + include ':react-native-keychain'
    + project(':react-native-keychain').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-keychain/android')
    
  • Edit android/app/build.gradle (note: app folder) to look like this:

    apply plugin: 'com.android.application'
    
    android {
      ...
    }
    
    dependencies {
      compile fileTree(dir: 'libs', include: ['*.jar'])
      compile 'com.android.support:appcompat-v7:23.0.1'
      compile 'com.facebook.react:react-native:0.19.+'
    + compile project(':react-native-keychain')
    }
    
  • Edit your MainActivity.java (deep in android/app/src/main/java/...) to look like this (note two places to edit):

    package com.myapp;
    
    + import com.oblador.keychain.KeychainPackage;
    
    ....
    
    public class MainActivity extends extends ReactActivity {
    
      @Override
      protected List<ReactPackage> getPackages() {
          return Arrays.<ReactPackage>asList(
                  new MainReactPackage(),
    +             new KeychainPackage()
          );
      }
      ...
    }
    

Todo

  • iOS support
  • Android support
  • Storing objects as JSON
  • Expose wider selection of underlying native APIs

License

MIT © Joel Arvidsson 2015