Overview

How your customers connect their third-party accounts in your product, the auth flow options, what they share, and when to use each.

An auth flow is how a customer authorizes a third-party app inside your product so Refold can act on their behalf. The flow runs in your frontend; once a customer connects, their credentials are stored against their linked account and Refold signs every request for them.

This page is your starting point for building that experience in a Native integration. The connection flows themselves and connection management are documented once in the Authentication hub; this section covers what is specific to a Native frontend, namely embedding the flow with the React SDK and branding it. (How a connector authenticates, such as OAuth vs key-based and scopes, is set once on the connector; see Authentication.)

Before you start

Every flow needs two things in place on your backend first. Never expose your API key in the browser:

1. Create a linked account

   Create one linked account per customer with a stable ID. See Create a linked account.

2. Generate a session token

   Mint a short-lived session token for that linked account and pass it to your frontend. The flow uses it instead of your API key.

Choose a flow

All three flows do the same job, let a customer authorize an app, and differ mainly in how much UI you build:

Flow	What it is	Build effort	Best when
Hosted flow	Redirect the customer to Refold’s hosted portal	Lowest, no UI	You want connect + config handled for you
React SDK flow	Drop Refold’s connect component into your React app (no redirect)	Low, prebuilt components	You have a React app and want it in-product
Build your own	Build a fully custom UI with the JavaScript SDK	Highest, full control	You need a bespoke connect experience

The React and build-your-own flows use the client-side SDKs; the hosted flow needs none.

After a customer connects

Once an account is connected, the customer configures what the integration does through config fields, and you keep the connection healthy over time:

• Connection status: check whether an account is connected.
• Re-authentication: prompt a reconnect when a connection expires or is revoked.
• Token refresh: how Refold keeps access tokens current automatically.

Make it yours

Match the connect experience to your brand:

• Custom styling: colors, naming, and layout.
• White-label flows: remove Refold branding from the experience.

Next steps

Hosted flow

The fastest way to ship, redirect to Refold’s hosted portal.

React SDK flow

Embed the connect experience in your React app.

Build your own

Full control with the JavaScript SDK.

Config fields

What the customer configures once they’re connected.