Giter VIP home page Giter VIP logo

react-native-plaid-link's Introduction

⚠️⚠️ Package no longer supported. Please use the official Plaid package: https://www.npmjs.com/package/react-native-plaid-link-sdk ⚠️⚠️


React Native Plaid Link auth

react_native_plaid_link_auth

Since Plaid.com doesn't have support for React Native and a lot o devs asked for an implementation, I've built this lib that adds support for Plaid authentication using a Webview and Plaid Link

Usage

yarn add react-native-plaid-link
yarn link react-native-webview

API

Prop Type defaultValue
publicKey (required) string
onMessage (required) function
env (required) string
product (required) string
clientName string
selectAccount boolean false
token string
userEmail string
userLegalName string
webhook string http://batman.codes
WebView props - -
render() {
  return <PlaidAuthenticator
    onMessage={this.onMessage}
    publicKey="YOUR_PLAID_PUBLIC_KEY"
    env="sandbox"
    product="auth,transactions"
    clientName="Catalin Miron"
    selectAccount={false}
  />
}

onMessage = (data) => {
  this.setState({data})
}
Returned data object
{
  "action": "plaid_link-undefined::connected",
  "metadata": {
    "account": {
      "id": null,
      "name": null
    },
    "account_id": null,
    "public_token": "public-sandbox-e697e666-9ac2-4538-b152-7e56a4e59365",
    "institution": {
      "name": "Chase",
      "institution_id": "ins_3"
    }
  }
}

For more information please read their docs

Type of actions:

Status Description
connected User completed the Link flow
requires_questions User prompted to answer security question(s)
requires_selections User prompted to answer multiple choice question(s)
requires_code User prompted to provide a one-time passcode
choose_device User prompted to select a device on which to receive a one-time passcode
requires_credentials User prompted to provide credentials for the selected financial institution or has not yet selected a financial institution
institution_not_found User exited the Link flow after unsuccessfully (no results returned) searching for a financial institution

For Sandbox mode the credentials are:

username: user_good
password: pass_good

Get your plaid API key

  • Go to Plaid dashboard and Sign in. image
  • Add Plaid to your app image
  • Copy your Plaid public_key

Questions?

Feel free to contact me:

Twitter: @mironcatalin Website: http://batman.codes

react-native-plaid-link's People

Contributors

7patricia avatar browniefed avatar catalinmiron avatar felipearosemena avatar kmcq avatar lucascarvalho avatar mbernardy avatar nikolal avatar ossareh avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar

react-native-plaid-link's Issues

Products prop taking an array

Just in case anyone is having this issue or if WebView is not loading correctly, Products takes an array of strings if you are trying to retrieve more than 1 product. I'm not sure if this is new or not but it is not specified in the documentation. Just a heads up! :)

Accessing the close button within the web view

Has anyone figured out how to access the close button (the X in the top right) programmatically within the webview?

I'd like to hook up the Android back button to call this close button. This is to handle the case where the user is on the connected page, after linking their account, but instead of hitting X or Continue, they hit back. As the user has connected their account, the application needs access to the metadata of the successfully linked account. This data is only provided if the user hits X or Continue. If the user closes using the back button, the app never receives this data.

Animation between pages

Hi,
I noticed that Plaid Link by default has fade transitions between pages (when you press continue from Home to choose bank). I noticed that this port does not have those transitions.

  1. Is this an issue only I'm having?
  2. Is there any way for me to fix it?

Metadata doesn't include public_token

On README we have an example of the data object we should expect to be returned.
But after connecting successfully, this is the object I get:

{
  action: "plaid_link-undefined::event"
  eventName: "TRANSITION_VIEW"
  metadata: {
    error_code: null
    error_message: null
    error_type: null
    exit_status: null
    institution_id: "ins_4"
    institution_name: "Wells Fargo"
    institution_search_query: null
    link_session_id: MY_LINK_SESSION_ID
    mfa_type: null
    request_id: MY_REQUEST_ID
    timestamp: "2019-11-05T16:43:20.186Z"
    view_name: "CONNECTED"
  }
}

The action plaid_link-undefined::connected never appears. So I'm not able to get some important info such as public_token to move on with the user authentication.

I'm using RN 0.61.2 and this is my component instance:

<PlaidAuthenticator
      onMessage={data => console.log('PLAID MESSAGE', data)}
      publicKey={PLAID_PUBLIC_KEY}
      env={PLAID_ENVIRONMENT}
      product="auth,transactions"
      clientName="Client"
      selectAccount={false}
    />

Has anyone experienced the same issue?

White blank screen

When I close plaid from the x icon it shows only a blank white screen.I have to press for example in my app a tab menu to go to a screen.Isn't there a way to specify what happens when you close plaid ?

Apple will stop accepting submissions of apps that use uiwebview apis in react native

Hi,

I'm facing issue as apple will stop accepting submissions of apps that use uiwebview apis in react native. This is due to in react-native-plaid-link used the react-native-webview package. upto version <7.0.1 the react-native-webview used the UIWebView. Now this UIWebView is deprecated and version >=7.0.1 used WKWebView instead UIWebView. But in react-native-plaid-link uses the 5.3.0 version of react-native-webview. Could you please update the react-native-webview version to >=7.0.1

Plaid Link OAuth redirect flow support

Hello @catalinmiron ,

In our project we are using react-native-plaid-link and recently we received an email from Plaid saying the following:

As we approach June 30, we wanted to ensure that your Plaid Link implementation is configured to support OAuth. If you're using Plaid Link in a WebView or using our native iOS SDK, some Plaid Link implementation changes are needed to best support the OAuth redirect flow in mobile experiences.

My question is - Is it planned to implement the OAuth redirect flow support and if not - will react-native-plaid-link continue to work if the bank requires OAuth?

Unhandled Promise Rejection leading to no data returned

When going through the bank select flow, getting a "Possible Unhandled Promise Rejection: Error: Unable to open URL: plaidlink://connected? ... "

Furthermore, I'm not receiving any data from the onMessage callback -- it keeps giving me

Object {
  "action": "plaid_link-undefined::resize",
  "height": "",
}

Any thoughts on why no data is being returned or logged to my console @catalinmiron ?

Access Denied

Hi,

I am getting "accessDenied" with some long Id after it, on on a blank screen when I try to use Plaid example:

<PlaidAuthenticator onMessage={this.onMessage} publicKey={plaidConfig.publicKey} env={plaidConfig.env} product={plaidConfig.products} clientName="Emma app" />

For a second I can see some other screen with two checkboxes, and message saying something like: "Emma app wants to... ", but I am instantly redirected to "AccessDenied'.

I am testing in sandbox mode.

Google recaptcha puzzle was hidden

Not sure if anybody face this problem. I used IPhone XS Max to implement the link flow on development environment. however, the Recaptcha is blocked by window width. I think this is not the problem of this library, but I still want to ask if anybody has solution to deal with this problem. Thanks!

Screen Shot 2019-10-02 at 11 28 22 AM

Update README to include selectAccount parameter

Issue

selectAccount parameter in PlaidAuthentication component is implemented but not documented

Solution

Include selectAccount parameter in the README documentation / example so developers can find out it existence without the need to review the source code

Pull Request: #18

SyntaxError: JSON Parse error: Unexpected identifier "setImmediate$0"

When the WebView loads, it throws the error:

SyntaxError: JSON Parse error: Unexpected identifier "setImmediate$0"
at node_modules/react-native/Libraries/Core/ExceptionsManager.js:104:6 in reportException
at node_modules/react-native/Libraries/Core/ExceptionsManager.js:171:19 in handleException
at node_modules/react-native/Libraries/Core/setUpErrorHandling.js:24:6 in handleError
at node_modules/expo-error-recovery/build/ErrorRecovery.fx.js:9:32 in ErrorUtils.setGlobalHandler$argument_0
at [native code]:null in flushedQueue
at [native code]:null in invokeCallbackAndReturnFlushedQueue

It seems like the error is cause because the plaid link page is running window.postMessage with a string containing setImmediate$0 which is then passed to JSON.parse(e.nativeEvent.data), and since it is not valid JSON, it throws the error.

ACH numbers not being returned

How do I retrieve account and routing numbers? Right, now I am only receiving:
id, name, subtype, and type

I need to retrieve the account and routing numbers

App crash when following links in Plaid End User Privacy Policy

How to recreate:

Click 'Plaid End User Privacy Policy' above Continue button
Click 'Learn more above plaid' under second Continue button

Scroll to bottom and Click 'See what data is being shared'

App will sometimes crash with an Unexpected token s in JSON at position 0.

From Line 86:

this.props.onMessage(JSON.parse(e.nativeEvent.data));

Seems like this is triggering onMessage with invalid data.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.