FastLink

https://github.com/yodlee/fastlink
Admin
FastLink is a mobile sample application that demonstrates how to integrate the FastLink application...
Tokens:4,495
Snippets:23
Trust Score:5.6
License:MIT
Update:6 months ago
Show doc for...
Tokens:
Raw
### Handle FastLink JavaScript Events

Source: https://context7.com/yodlee/fastlink/llms.txt

This snippet defines the structure of events sent from the FastLink WebView to the native application layer. It includes examples for handling account exit actions, external URL navigation, and OAuth authentication flows.

```javascript
{
  "type": "POST_MESSAGE",
  "data": {
    "action": "exit",
    "sites": [{ "siteAccountId": "12345", "status": "SUCCESS" }]
  }
}

{
  "type": "OPEN_EXTERNAL_URL",
  "data": {
    "url": "https://example.com/help"
  }
}

{
  "type": "BANK_OAUTH_URL",
  "data": {
    "url": "https://bank.com/oauth/authorize?..."
  }
}
```

--------------------------------

### Android Java: Load FastLink in WebView and Handle Events

Source: https://context7.com/yodlee/fastlink/llms.txt

Demonstrates how to load FastLink within an Android WebView using an HTTP POST request with an access token. It includes a JavaScript interface handler to process events such as user exit, external URL navigation, and bank OAuth flows initiated by FastLink.

```Java
public class Config {
    public static String fastlinkURL = "https://fl4.sandbox.yodlee.com/authenticate/restserver/fastlink";
}

public class WebViewActivity extends AppCompatActivity {
    public WebView webview;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        Intent intent = getIntent();
        String fastlinkURL = intent.getStringExtra("fastlinkURL");
        String accessToken = intent.getStringExtra("accessToken");
        String extraParams = intent.getStringExtra("extraParams");

        setContentView(R.layout.activity_web_view);
        webview = (WebView) findViewById(R.id.webview);

        webview.getSettings().setJavaScriptEnabled(true);
        WebView.setWebContentsDebuggingEnabled(true);

        webview.addJavascriptInterface(new JSInterfaceHandler(this), "YWebViewHandler");

        try {
            String postData = "accessToken=Bearer " + accessToken +
                "&extraParams=" + URLEncoder.encode(extraParams, "UTF-8");

            webview.postUrl(fastlinkURL, postData.getBytes());
        } catch (UnsupportedEncodingException e) {
            e.printStackTrace();
        }
    }
}

class JSInterfaceHandler {
    Context mContext;
    ArrayList<String> eventsInfo = new ArrayList<String>();

    JSInterfaceHandler(Context c) {
        mContext = c;
    }

    @JavascriptInterface
    public void postMessage(final String data) {
        Log.d("FL:MESSAGE", data);
        eventsInfo.add(data);

        try {
            JSONObject userData = new JSONObject(data);
            String type = userData.getString("type");
            JSONObject _data = userData.getJSONObject("data");

            if (type.equals("POST_MESSAGE")) {
                if (_data.has("action") && _data.getString("action").equals("exit")) {
                    Intent intent = new Intent(mContext.getApplicationContext(), EventsInfoActivity.class);
                    intent.putExtra("eventsInfo", eventsInfo);
                    mContext.startActivity(intent);
                }
            }

            if (type.equals("OPEN_EXTERNAL_URL")) {
                String URL = _data.getString("url");
                Intent intent = new Intent(Intent.ACTION_VIEW, Uri.parse(URL));
                mContext.startActivity(intent);
            }

            if (type.equals("BANK_OAUTH_URL")) {
                String URL = _data.getString("url");
                Intent intent = new Intent(Intent.ACTION_VIEW, Uri.parse(URL));
                mContext.startActivity(intent);
            }
        } catch (JSONException e) {
            Log.d("FL:ERROR", e.getMessage());
        }
    }
}
```

--------------------------------

### Integrate FastLink with WKWebView in Swift

Source: https://context7.com/yodlee/fastlink/llms.txt

This snippet demonstrates how to configure a WKWebView to load FastLink via a POST request and implement the WKScriptMessageHandler to process events such as exit actions, external URL navigation, and OAuth flows.

```swift
import UIKit
import WebKit

@available(iOS 13.0, *) 
class FastLinkViewController: UIViewController, WKUIDelegate, WKNavigationDelegate {

    @IBOutlet weak var webview: WKWebView!
    var fastlinkURL = ""
    var accessToken = ""
    var extraParams = ""

    override func viewDidLoad() {
        super.viewDidLoad()
        self.webview.uiDelegate = self
        self.webview.navigationDelegate = self
        self.webview.configuration.userContentController.add(self, name: "YWebViewHandler")

        guard let url = URL(string: fastlinkURL) else { return }
        var request = URLRequest(url: url)
        request.setValue("application/x-www-form-urlencoded", forHTTPHeaderField: "Content-Type")
        request.httpMethod = "POST"

        let postString = "accessToken=Bearer " + accessToken + "&extraParams=" + extraParams
        request.httpBody = postString.data(using: .utf8)
        self.webview.load(request)
    }
}

extension FastLinkViewController: WKScriptMessageHandler {
    func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
        if message.name == "YWebViewHandler" {
            // Handle incoming JSON events from FastLink here
        }
    }
}
```

--------------------------------

### React Native Navigation to FastLink View

Source: https://context7.com/yodlee/fastlink/llms.txt

This code snippet demonstrates how to navigate to the FastLink WebView component from a login view. It sets up state for FastLink URL, access token, and extra parameters, then passes these as navigation parameters.

```javascript
// LoginView.js - Navigation to FastLink
import React, { useState } from 'react'
import { View, TextInput } from 'react-native'
import Config from './../Config'

const LoginView = ({ navigation }) => {
    const [fastlinkURL, setFastlinkURL] = useState(Config.fastLinkURL)
    const [accessToken, setAccessToken] = useState('')
    const [extraParams, setExtraParams] = useState(
        'configName=Aggregation&intentUrl=yodlee://backtofastlink'
    )

    const handleSignIn = () => {
        navigation.navigate('FastLink', {
            fastlinkURL: fastlinkURL,
            accessToken: accessToken,
            extraParams: extraParams
        })
    }

    // ... render form with TextInputs and Sign In button
}

```

--------------------------------

### Flutter FastLink WebView Implementation

Source: https://context7.com/yodlee/fastlink/llms.txt

This Flutter code implements a WebView to load Yodlee FastLink. It uses an auto-submitting HTML form to initiate the FastLink process and registers a JavaScript channel ('YWebViewHandler') to receive and process events from FastLink. It handles external URLs, bank OAuth URLs, and the exit action by navigating to a different view.

```Dart
library constants;
const String FASTLINK_URL = "https://fl4.sandbox.yodlee.com/authenticate/restserver/fastlink";
```

```Dart
import 'dart:convert';
import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';
import 'package:url_launcher/url_launcher.dart';
import 'eventsInfoView.dart';

class FastLinkViewArguments {
  final String fastLinkURL;
  final String accessToken;
  final String extraParams;
  FastLinkViewArguments(this.fastLinkURL, this.accessToken, this.extraParams);
}

class FastLinkView extends StatelessWidget {
  WebViewController _controller;
  BuildContext fastlinkViewContext;
  String fastLinkURL = "";
  String accessToken = "";
  String extraParams = "";
  var EventsInfoMap = [];

  @override
  Widget build(BuildContext context) {
    fastlinkViewContext = context;
    final FastLinkViewArguments routeParams =
        ModalRoute.of(context).settings.arguments as FastLinkViewArguments;

    fastLinkURL = routeParams.fastLinkURL;
    accessToken = routeParams.accessToken;
    extraParams = routeParams.extraParams;

    return Scaffold(
      appBar: AppBar(title: Text('FastLink')),
      body: WebView(
        initialUrl: 'about:blank',
        javascriptMode: JavascriptMode.unrestricted,
        javascriptChannels: Set.from([
          JavascriptChannel(
            name: 'YWebViewHandler',  // MUST be 'YWebViewHandler'
            onMessageReceived: (JavascriptMessage eventData) {
              _handleEventsFromJS(eventData.message);
            }
          )
        ]),
        onWebViewCreated: (WebViewController webViewController) {
          _controller = webViewController;
          _loadFastLink();
        },
      ),
    );
  }

  // Load FastLink via HTML form auto-submit
  _loadFastLink() async {
    String _htmlString = '''<html>
      <body>
        <form name="fastlink-form" action="$fastLinkURL" method="POST">
          <input name="accessToken" value="Bearer $accessToken" hidden="true" />
          <input name="extraParams" value="$extraParams" hidden="true" />
        </form>
        <script type="text/javascript">
          window.onload = function () {
            document.forms["fastlink-form"].submit();
          }
        </script>
      </body>
    </html>''';

    _controller.loadUrl(Uri.dataFromString(
      _htmlString,
      mimeType: 'text/html',
      encoding: Encoding.getByName('utf-8')
    ).toString());
  }

  _handleEventsFromJS(message) {
    Map<String, dynamic> eventData = jsonDecode(message);
    EventsInfoMap.add(eventData);

    // Handle external URL
    if (eventData["type"] == "OPEN_EXTERNAL_URL") {
      String url = eventData["data"]["url"];
      _launchURL(url);
    }

    // Handle bank OAuth URL
    if (eventData["type"] == "BANK_OAUTH_URL") {
      String url = eventData["data"]["url"];
      _launchURL(url);
    }

    // Handle exit action
    if (eventData["type"] == "POST_MESSAGE") {
      String action = eventData["data"]["action"];
      if (action == "exit") {
        Navigator.pushNamed(fastlinkViewContext, '/eventsInfoView',
            arguments: EventsInfoViewArguments(EventsInfoMap));
      }
    }
  }

  _launchURL(url) async {
    if (await canLaunch(url)) {
      await launch(url, forceSafariVC: false, forceWebView: false);
    } else {
      print('Could not launch $url');
    }
  }
}
```

```Dart
import 'package:flutter/material.dart';
import 'config.dart' as Config;
import 'fastlinkView.dart';

class LoginView extends StatelessWidget {
  String fastLinkURL = Config.FASTLINK_URL;
  String accessToken = "";
  String extraParams = "configName=Aggregation&intentUrl=yodlee://backtofastlink";

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Login')),
      body: Form(
        child: Column(
          children: [
            TextFormField(
              initialValue: fastLinkURL,
              decoration: InputDecoration(labelText: 'FastLink URL'),
              onChanged: (value) => fastLinkURL = value,
            ),
            TextFormField(
              decoration: InputDecoration(labelText: 'Access Token'),
              onChanged: (value) => accessToken = value,
            ),
            TextFormField(
              initialValue: extraParams,
              decoration: InputDecoration(labelText: 'Extra Params'),
              onChanged: (value) => extraParams = value,
            ),
            RaisedButton(
              child: Text('Sign in'),
              onPressed: () {
                Navigator.pushNamed(context, '/fastlinkView',
                    arguments: FastLinkViewArguments(fastLinkURL, accessToken, extraParams));
              },
            ),

```

--------------------------------

### FastLink JavaScript Event Interface

Source: https://context7.com/yodlee/fastlink/llms.txt

Details on the event structure and types sent from the FastLink WebView to the native layer.

```APIDOC
## POST_MESSAGE (Event Type)

### Description
This event is triggered when the user completes an action within the FastLink flow, such as exiting the flow or finishing account addition.

### Parameters
- **type** (string) - Required - The event identifier, always 'POST_MESSAGE'.
- **data** (object) - Required - Contains the 'action' (e.g., 'exit') and 'sites' array detailing the status of added accounts.

### Request Example
{
  "type": "POST_MESSAGE",
  "data": {
    "action": "exit",
    "sites": [{ "siteAccountId": "12345", "status": "SUCCESS" }]
  }
}

## OPEN_EXTERNAL_URL (Event Type)

### Description
Triggered when the user interacts with an external link within the FastLink flow that requires opening in a browser.

### Parameters
- **type** (string) - Required - The event identifier, always 'OPEN_EXTERNAL_URL'.
- **data** (object) - Required - Contains the 'url' string to be opened.

### Request Example
{
  "type": "OPEN_EXTERNAL_URL",
  "data": {
    "url": "https://example.com/help"
  }
}

## BANK_OAUTH_URL (Event Type)

### Description
Triggered when a financial institution requires OAuth authentication. The native app must intercept this and open the URL in an external browser.

### Parameters
- **type** (string) - Required - The event identifier, always 'BANK_OAUTH_URL'.
- **data** (object) - Required - Contains the 'url' string for the OAuth authorization flow.

### Request Example
{
  "type": "BANK_OAUTH_URL",
  "data": {
    "url": "https://bank.com/oauth/authorize?..."
  }
}
```

--------------------------------

### React Native FastLink WebView Component

Source: https://context7.com/yodlee/fastlink/llms.txt

This component loads Yodlee FastLink using react-native-webview with POST data. It handles messages from FastLink, including exit events and external URL requests, by parsing the data received in the onMessage callback.

```javascript
// Config.js
const config = {
    fastLinkURL: 'https://fl4.sandbox.yodlee.com/authenticate/restserver/fastlink'
}
export default config

// FastLinkView.js
import React from 'react'
import { View, Linking, Alert } from 'react-native'
import { WebView } from 'react-native-webview'

const FastLinkContainerView = ({ route, navigation }) => {
    const { fastlinkURL, accessToken, extraParams } = route.params
    let messageData = []

    // Create URL-encoded POST data
    let postData = 'accessToken=Bearer ' + accessToken +
        '&extraParams=' + encodeURIComponent(extraParams)

    // Handle messages from FastLink
    let handleMessage = data => {
        if (data) {
            let parsedMessageData = JSON.parse(data)
            messageData.push(parsedMessageData)

            // Handle exit action - user clicked close/finish
            if (parsedMessageData.type === 'POST_MESSAGE') {
                let data = parsedMessageData.data
                if (data.action === 'exit') {
                    navigation.navigate('EventsInfo', { messageData: messageData })
                }
            }

            // Handle external URL clicks
            if (parsedMessageData.type === 'OPEN_EXTERNAL_URL') {
                let url = parsedMessageData.data.url
                Linking.canOpenURL(url).then(supported => {
                    if (supported) {
                        Linking.openURL(url)
                    } else {
                        Alert.alert('Alert', 'Opening url not supported')
                    }
                })
            }

            // Handle bank OAuth URL
            if (parsedMessageData.type === 'BANK_OAUTH_URL') {
                let url = parsedMessageData.data.url
                Linking.canOpenURL(url).then(supported => {
                    if (supported) {
                        Linking.openURL(url)
                    } else {
                        Alert.alert('Alert', 'Opening url not supported')
                    }
                })
            }
        }
    }

    return (
        <View style={{ flex: 1 }}>
            <WebView
                source={{
                    uri: fastlinkURL,
                    headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
                    body: postData,
                    method: 'POST'
                }}
                javaScriptEnabled={true}
                style={{ flex: 1 }}
                onMessage={event => {
                    // onMessage receives events from FastLink
                    handleMessage(event.nativeEvent.data)
                }}
            />
        </View>
    )
}

export default FastLinkContainerView

```
Tokens:
Raw