Sandbox Guide

Learn how to test your integration in the Sandbox environment.

Getting up and running with the Argyle API is as simple as the following process. Additional customization is available once you have completed your initial integration, but we have left that out of this guide intentionally for simplicity's sake.

For a comprehensive list of all the things you can do with Argyle's API please refer to the API reference. To learn more about the data that you can access, please read the data structure guide.


Step 1: Integrate Argyle Link

All you need to do to embed Argyle Link into your web application is include argyle.web.js on your webpage and initialize it by providing a list of configuration options.

You can then invoke the Argyle Link UI element at any time within your application.

Integration examples

<!doctype html>
<html>
  <head>
      <meta charset="utf-8"/>
  </head>
  <body>
    <script src="https://plugin.argyle.com/argyle.web.v3.js"></script>
    <script type="text/javascript">
      const argyle = Argyle.create({
        apiHost: 'https://api-sandbox.argyle.com/v1',
        linkKey: 'YOUR_LINK_KEY',
        onAccountCreated: ({ accountId, userId, linkItemId }) => {
          console.log('Account created: ', accountId, ' User ID:', userId, ' Link Item ID:', linkItemId)
        }
      });
      argyle.open();
    </script>
  </body>
</html>
_ = Argyle.shared
    .loginWith(linkKey: "YOUR_LINK_KEY", apiHost: "https://api-sandbox.argyle.com/v1")
    .resultListener(self)

let argyle = Argyle.shared.controller
argyle.modalPresentationStyle = .fullScreen
self.present(argyle, animated: true, completion: nil)
val config = ArgyleConfig.Builder()
    .loginWith("YOUR_LINK_KEY", "https://api-sandbox.argyle.com/v1", "")
    .build()

Argyle.instance.init(config)
Argyle.instance.startSDK(this)
import ArgyleSdk from '@argyleio/argyle-plugin-react-native'

// Configure the SDK before hand, once. only call ArgyleSdk.start() when the UI is needed
ArgyleSdk.loginWith("YOUR_LINK_KEY", "https://api-sandbox.argyle.com/v1", "")

// Launch the SDK
ArgyleSdk.start()

To run the example on your own machine:

  1. Copy-paste the snippet into an empty index.html file.
  2. Replace the YOUR_LINK_KEY placeholder with your own linkKey, which can be found in the API keys section of the Console in the Link key row.
  3. Open the index.html in a web browser. Argyle Link will open a modal window where you can select a data partner and connect work accounts.

👍

You can also integrate Argyle Link for Android, iOS, or React Native.


Step 2: Connect a work account

Now that you've set up Argyle Link and configured it with your linkKey, you can open Argyle's UI element anywhere in your application.

Your users navigate the Argyle Link UI to connect their work accounts to Argyle and grant you access to their work history.

Within the Sandbox environment, there are two slightly different data sets:

  • Rideshare/Delivery — if you select a gig company like Uber or Doordash, the data will have more activity (duration, distance, etc.) information.
  • General — if you select any other company or payroll platform, the data will reflect traditional employment records.

Connect a work accountConnect a work account

You might have noticed the apiHost configuration parameter in the example code pointing to https://api-sandbox.argyle.com/v1. This ensures that the plugin starts in a sandbox environment where you can use the sandbox credentials below to test Argyle Link.

When running in the sandbox environment, you can only connect work accounts with the provided sandbox credential, which work for any Link item.

BobSarahJoe
Email[email protected][email protected][email protected]
Usernametest_1test_2test_3
Passwordpassgoodpassgoodpassgood
Verification code808180828083
Phone number(800) 900-0001(800) 900-0002(800) 900-0003
Driver's licenseD1230001D1230002D1230003

Make sure that you select the appropriate credentials item. For example, Walmart requires username and password, while Uber requires email and password.

Before proceeding to the next step, make sure to click on one of the Link items and use one of the sandbox credentials to connect it.


Step 3: Retrieve employment data

After your users connect their work accounts, your application can start using Argyle's API to retrieve information in their work account.

The Argyle API uses basic access authentication: you have to specify your credentials with every request you make to the API.

Here's an example API call using curl:

curl https://api-sandbox.argyle.com/v1/activities?account=account_id \
-u your_client_id:your_client_secret

Before running the curl command make sure to replace your_client_id and your_client_secret with your own credentials, which you can access in the Argyle Console.

The API call will return a JSON object that contains a list of activities (for example: Uber trips, Instacart deliveries, etc.) performed by your customers.

{
  "count": 478,
  "next": "http://api.argyle.com/v1/activities?limit=10&offset=10",
  "previous": null,
  "results":[
     {
        "id": "0018cf02-f8d9-4a7b-9876-2f2167a4c0f5",
        "account": "f15eec4c-7b39-48ac-8577-7385456591f4",
        "created_at": "2019-04-19T11:14:13.708Z",
        "start_date": "2018-04-10T06:46:00Z",
        "end_date": "2018-04-10T06:46:00Z",
        "income": "4.30",
        ...
     },
     ...
  ]
}

This specific API call returns activities for all of your customers who have connected their work accounts through Argyle Link.

To learn more about how to filter activities for a specific user, retrieve other data such as profile, or a list of your customer's vehicles, refer to the API reference documentation and the guide for Argyle Link.


Step 4: Trigger a periodic scan

In the production environment, new data for connected accounts is constantly generated and delivered to you (for example: new payouts, activities) during periodic data scans. For testing purposes, you can trigger a periodic scan yourself to get new data for an already connected account. Please use the following endpoint:

https://api-sandbox.argyle.com/v1/accounts/<acc-id>/periodic-scan

It accepts POST requests with an empty body.

<acc-id> must be a Sandbox accounts.id, otherwise an error will be returned:

{
    "account": [
        "Periodic scan can be manually scheduled only for sandbox accounts."
    ]
}

This endpoint can be used for testing webhook integration and new data arrival.

Periodic scan data

A periodic scan for sandbox accounts will return 1-5 new payouts and activities. A periodic scan can be triggered as many times as you need for testing.


Pay distribution testing

You can test pay distribution updates in the Sandbox environment as well.

Create a pay distribution configuration

Argyle Link initiates a pay distribution update process if a pay distribution configuration is provided. The Pay distribution configuration describes the desired outcome of that update.

See these examples to understand how to set up your configuration:

// Argyle Link will request 20% of user's pay
// to be transferred to the account specified.
{
    "bank_account": {
        "bank_name": "New Bank",
        "routing_number": "084101234",
        "account_number": "9483746361234",
        "account_type": "checking"
    },
    "percent_allocation": {
        "value": "20"
    }
}
// Argyle Link will request 200 of user's pay
// to be transferred to the account specified.
{
    "bank_account": {
        "bank_name": "New Bank",
        "routing_number": "084101234",
        "account_number": "9483746361234",
        "account_type": "checking"
 },
    "amount_allocation": {
            "value": "200"
    }
}

Allocations in the pay distribution configuration are recommendations. Users can modify the amounts or percentage of their pay to go to your account.

If you want to restrict the percentage or amount your user can allocate, define the min_value and max_value parameters as shown in this next example:

// Argyle Link will default to the amount view, but it will
// let the user chose if they want to transfer 20 percent or 200 dollars.
// Percent value will be 20 by default, 
// but the user will be able to change it with a value 
// in the range from 10 to 30.
// Amount value will be fixed to 200.
{
    "bank_account": {
        "bank_name": "New Bank",
        "routing_number": "084101234",
        "account_number": "9483746361234",
        "account_type": "checking"
 },
    "default_allocation_type": "amount",
    "percent_allocation": {
            "value": "20",
            "min_value": "10",
            "max_value": "30"
    },
    "amount_allocation": {
            "value": "200",
            "min_value": "200",
            "max_value": "200"
    }
}

If the config contains only a percent allocation, Argyle restricts the options to percent only for the user. In the same way, if only the amount allocation is configured, the user will not be able to transfer you a percentage of their pay.

Allocation parametersAllocation parameters

You can also configure pay distribution to allow users to add cards. Use feature.pay_distribution_card_update to learn which Link items support cards.

Refer to the Pay distribution guide for more example configurations and specific use cases.


Pay distribution configuration parameters

For detailed descriptions of each pay distribution configuration parameter, refer to the Pay Distribution configs in the API Reference.

For visual examples of all customizable UI elements on the Pay Distribution screen in Link, refer to the Link customization guide.


Integrate Argyle Link

To start the pay distribution update process in Argyle Link you must initialize it with the payDistributionConfig parameter set to an encrypted version of your pay distribution configuration.

The encryption is necessary to ensure your bank account details are never exposed on the front-end. Your full routing and account numbers always appear encrypted on the end user's device.

To encrypt your pay distribution config make a POST request into pay-distribution-config/encrypt with your pay distribution config in the payload.

POST /v1/pay-distribution-configs/encrypt
{
 "bank_account": {
 "bank_name": "New Bank",
 "account_type": "checking",
 "routing_number": "123456789",
 "account_number": "1234567890"
 },
 "percent_allocation": {
            "value": "60"
    }
}

You will get the following response that contains the encrypted version of your config:

{
    "encrypted_config": "CiQAB/5leTZndFpuHjsJx1SMoI2PnGDpaTPib/ApXLhVNHVuVukS8wEAfV+QlRWuG52YXKQSdy0hKg1Y768QUtOyI5CRMl7LRWn6axC0NZ3W3qxNoSgS3cXMikKibn6y40hZMMvUmUHriUXbNvtMUWT+6BrB6ATgH69Ng0CoS36tsDtQbitkHK3Iv6v8GQ7gRda8djQ6Uc5DfoTR8vF+brwhV+LvBIORoueVXQAp7GSzlYUicfeqnOXdyKjkF4QibzWrkFyw8b2cuUvvbwxyJe2IVSkZVuyATa06XDkxSbu9+cWPj6sV1iZfNGPiz/GjpMg+cVzkhqMHZFAqj6EmwgCse2DelFQ8HHkNoB9dI63lTa1NJY11B80K2B8="
}

Initializing Link with the payDistributionConfig parameter with the encrypted pay distribution configuration value will set up Link to run the pay distribution update process.

Link initialization example with pay distribution config

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
  </head>
  <body>
    <script src="https://plugin.argyle.com/argyle.web.v3.js"></script>
    <script type="text/javascript">
      const argyle = Argyle.create({
        linkKey: 'YOUR_LINK_KEY',
        apiHost: 'https://api-sandbox.argyle.com/v1',
        payDistributionItemsOnly: true,
        payDistributionConfig: "CiQAB/5leTZndFpuHjsJx1SMoI2PnGDpaTPib/ApXLhVNHVuVukS8wEAfV+QlRWuG52YXKQSdy0hKg1Y768QUtOyI5CRMl7LRWn6axC0NZ3W3qxNoSgS3cXMikKibn6y40hZMMvUmUHriUXbNvtMUWT+6BrB6ATgH69Ng0CoS36tsDtQbitkHK3Iv6v8GQ7gRda8djQ6Uc5DfoTR8vF+brwhV+LvBIORoueVXQAp7GSzlYUicfeqnOXdyKjkF4QibzWrkFyw8b2cuUvvbwxyJe2IVSkZVuyATa06XDkxSbu9+cWPj6sV1iZfNGPiz/GjpMg+cVzkhqMHZFAqj6EmwgCse2DelFQ8HHkNoB9dI63lTa1NJY11B80K2B8="
      })
      argyle.open()
    </script>
  </body>
</html>
let PD_CONFIG = "CiQAB/5leTZndFpuHjsJx1SMoI2PnGDpaTPib/ApXLhVNHVuVukS8wEAfV+QlRWuG52YXKQSdy0hKg1Y768QUtOyI5CRMl7LRWn6axC0NZ3W3qxNoSgS3cXMikKibn6y40hZMMvUmUHriUXbNvtMUWT+6BrB6ATgH69Ng0CoS36tsDtQbitkHK3Iv6v8GQ7gRda8djQ6Uc5DfoTR8vF+brwhV+LvBIORoueVXQAp7GSzlYUicfeqnOXdyKjkF4QibzWrkFyw8b2cuUvvbwxyJe2IVSkZVuyATa06XDkxSbu9+cWPj6sV1iZfNGPiz/GjpMg+cVzkhqMHZFAqj6EmwgCse2DelFQ8HHkNoB9dI63lTa1NJY11B80K2B8=" // your encrypted pay distribution config

_ = Argyle.shared
    .loginWith(linkKey: "YOUR_LINK_KEY", apiHost: "https://api-sandbox.argyle.com/v1") 
    .payDistributionUpdateFlow(true) 
    .payDistributionConfig(PD_CONFIG) 
    .payDistributionItemsOnly(true) // only Link items that support pay distribution update will be shown to users.
    .resultListener(self)

let argyle = Argyle.shared.controller
argyle.modalPresentationStyle = .fullScreen
self.present(argyle, animated: true, completion: nil)
val PD_CONFIG = "CiQAB/5leTZndFpuHjsJx1SMoI2PnGDpaTPib/ApXLhVNHVuVukS8wEAfV+QlRWuG52YXKQSdy0hKg1Y768QUtOyI5CRMl7LRWn6axC0NZ3W3qxNoSgS3cXMikKibn6y40hZMMvUmUHriUXbNvtMUWT+6BrB6ATgH69Ng0CoS36tsDtQbitkHK3Iv6v8GQ7gRda8djQ6Uc5DfoTR8vF+brwhV+LvBIORoueVXQAp7GSzlYUicfeqnOXdyKjkF4QibzWrkFyw8b2cuUvvbwxyJe2IVSkZVuyATa06XDkxSbu9+cWPj6sV1iZfNGPiz/GjpMg+cVzkhqMHZFAqj6EmwgCse2DelFQ8HHkNoB9dI63lTa1NJY11B80K2B8=" // your encrypted pay distribution config

val config = ArgyleConfig.Builder()
    .loginWith("YOUR_LINK_KEY", "https://api-sandbox.argyle.com/v1", "")
    .payDistributionConfig(PD_CONFIG)
    .payDistributionItemsOnly(true)  // only Link items that support pay distribution update will be shown to users.
    .payDistributionUpdateFlow(true) 
    .setCallbackListener(object : Argyle.ArgyleResultListener {
        // callbacks 
    })
    .build()

Argyle.instance.init(config)
Argyle.instance.startSDK(this)
import ArgyleSdk from '@argyleio/argyle-plugin-react-native'

const PD_CONFIG = 'CiQAB/5leTZndFpuHjsJx1SMoI2PnGDpaTPib/ApXLhVNHVuVukS8wEAfV+QlRWuG52YXKQSdy0hKg1Y768QUtOyI5CRMl7LRWn6axC0NZ3W3qxNoSgS3cXMikKibn6y40hZMMvUmUHriUXbNvtMUWT+6BrB6ATgH69Ng0CoS36tsDtQbitkHK3Iv6v8GQ7gRda8djQ6Uc5DfoTR8vF+brwhV+LvBIORoueVXQAp7GSzlYUicfeqnOXdyKjkF4QibzWrkFyw8b2cuUvvbwxyJe2IVSkZVuyATa06XDkxSbu9+cWPj6sV1iZfNGPiz/GjpMg+cVzkhqMHZFAqj6EmwgCse2DelFQ8HHkNoB9dI63lTa1NJY11B80K2B8=' // your encrypted pay distribution config

// Configure the SDK before hand, once. only call ArgyleSdk.start() when the UI is needed
ArgyleSdk.loginWith("YOUR_LINK_KEY", "https://api-sandbox.argyle.com/v1", "")
ArgyleSdk.payDistributionConfig(PD_CONFIG)
ArgyleSdk.payDistributionUpdateFlow(true)
ArgyleSdk.payDistributionItemsOnly(true)  // only Link items that support pay distribution update will be shown to users.

// Launch the SDK
ArgyleSdk.start()

If the payDistributionItemsOnly is set to true, Link will show only companies and platforms that support direct deposit update functionality.


Did this page help you?