Crypto on and off-ramps

Crypto on and off-ramps

Typically, getting crypto onto XpansionChain Layer 2 wallets is a multi-step process. A common flow is:

  1. A user obtains crypto on L1 (such as by purchasing it on an exchange like Coinbase)

  2. Transfers it from the exchange to an L1 wallet that they own

  3. Deposits it from the L1 wallet to their XpansionChain L2 wallet

However, there are crypto on-ramp and off-ramp providers that enable users to get crypto in and out of L2 wallets in a single step. XpansionChain makes it easy for you to integrate with the following providers via our SDKs and API:

Provider
How does it work?
Fees
Min. purchase / deposit
Restrictions

MoonPay

Users can buy crypto with a card payment and it is immediately transferred to their L2 wallet

See MoonPay's transaction fee

$20USD

See these lists of non-supported countries: - On-ramp - Off-ramp

Layerswap

Users can transfer crypto they own in a centralised exchange account (ie. Coinbase) directly to their L2 wallet

See Layerswap's transfer fees

0.009ETH / 15IMX / 12USDC

📝GUIDES

  • Core SDK

    • On-ramp

    • Off-ramp

  • Link SDK:

    • On-ramp

    • Off-ramp

  • API

Core SDK

Currently, this functionality is only available in the Typescript Core SDK. Please refer to the API endpoints referenced in each step for other implementations. The full list of endpoints required are also listed here.

On-ramp

1. Initialize the Core SDK

In order to use the Core SDK, you need to initialize it.

2. Create the on-ramp request

📚API REFERENCE

  • createExchange

📚SDK REFERENCE

  • createExchange

  • MoonPay

const exchangeTxnParams: ExchangesApiCreateExchangeRequest = {
  createExchangeAPIRequest: {
    provider: 'moonpay',
    type: 'onramp',
    wallet_address: '0xqw2...', // L2 wallet
    widget: { theme: 'light' },
  },
};

const exchangeTxnResponse = await imxClient.createExchange(exchangeTxnParams);

This displays the UI with the loaded MoonPay widget.

The user will be asked to provide credit card details: MoonPay widget

After creating a transaction successfully, you will be provided with the specified provider's widget URL to be rendered where users can proceed with transfer.

The user proceeds with transfer details on the provider's widget.

  • Layerswap

const exchangeTxnParams: ExchangesApiCreateExchangeRequest = {
  createExchangeAPIRequest: {
    provider: 'layerswap',
    type: 'onramp',
    wallet_address: '0xqw2...', // L2 wallet
    widget: { theme: 'light' },
  },
};

const exchangeTxnResponse = await imxClient.createExchange(exchangeTxnParams);

This displays the UI with the loaded Layerswap widget.

The user will be asked to connect to the exchange they want to use: Layerswap widget

After creating a transaction successfully, you will be provided with the specified provider's widget URL to be rendered where users can proceed with transfer.

The user proceeds with transfer details on the provider's widget.

3. Verify the transaction status

📚API REFERENCE

  • createExchange

📚SDK REFERENCE

  • getExchange

Please consider checking the transaction status in a polling fashion in the background.

const getExchangeTransactionResponse = await imxClient.getExchange({
  id: exchangeTxnResponse.id,
});

The transfer process can take few minutes and during that time transaction can return a pending or waitingPayment status while it's still being processed. The final stage of transaction status can be:

  • completed - successful completion

  • failed - failure encountered

Upon reaching final stage of the transaction status, you can show an appropriate message, send a notification or update any state with the successful/failed transaction.

Off-ramp

1. Initialize the Core SDK

In order to use the Core SDK, you need to initialize it.

2. Create the off-ramp request

📚API REFERENCE

  • createExchange

📚SDK REFERENCE

  • createExchange

  • MoonPay

onst exchangeTxnParams: ExchangesApiCreateExchangeRequest = { createExchangeAPIRequest: { provider: 'moonpay', type: 'offramp', wallet_address: '0xqw2...', // L2 wallet widget: { theme: 'light' }, }, };

const exchangeTxnResponse = await imxClient.createExchange(exchangeTxnParams);

  • Layerswap

const exchangeTxnParams: ExchangesApiCreateExchangeRequest = {
  createExchangeAPIRequest: {
    provider: 'layerswap',
    type: 'offramp',
    wallet_address: '0xqw2...', // L2 wallet
    widget: { theme: 'light' },
  },
};

const exchangeTxnResponse = await imxClient.createExchange(exchangeTxnParams);

After creating a transaction successfully, you will be provided with the specified provider's widget URL to be rendered where users can proceed with entering transfer details.

3. Get transaction details

📚API REFERENCE

  • getExchange

📚SDK REFERENCE

  • getExchange

Please consider checking the transaction status in a polling fashion in the background.

const transactionDetails = await imxClient.getExchange({
  id: exchangeTxnResponse.id,
});

3. Get transaction details

📚API REFERENCE

  • getExchange

📚SDK REFERENCE

  • getExchange

Please consider checking the transaction status in a polling fashion in the background.

const transactionDetails = await imxClient.getExchange({
  id: exchangeTxnResponse.id,
});

4. Generate signers

Initiating an off-ramp request for a user requires a user's signature, so your application will need to create signers. See the guide on how to generate signers.

5. Initiate the off-ramp request

📚API REFERENCE

  • getExchangeSignableTransfer

  • createExchangeTransfer

📚SDK REFERENCE

  • exchangeTransfer

Before initiating the off-ramp request, check that the transaction details have been fetched (see Step 3).

Once the details are fetched and status is waitingPayment, initiate the request:

const exchangeTransferParams: UnsignedExchangeTransferRequest = {
  type: transactionDetails.data.from_currency, // "ETH"
  amount: transactionDetails.data.from_amount, // "0.001"
  transactionID: transactionDetails.id,
  receiver: transactionDetails.provider_wallet_address,
};

const exchangeTransferResponse = await imxClient.exchangeTransfer(
  walletConnection,
  exchangeTransferParams
);

It will prompt the user to sign the request to proceed with the transaction.

6. Verify the transaction status

See 3. Verify the transaction status in the on-ramp guide.

API

On-ramp endpoints:

Step
Description
API endpoint

1

Create the on-ramp request

createExchange

2

Verify the transaction status

getExchange

Off-ramp endpoints:

Step
Description
API endpoint

1

Create the off-ramp request

createExchange

2

Get transaction details

getExchange

3

Get the transaction details to be signed when initiating the off-ramp request

getExchangeSignableTransfer

4

Initiate the off-ramp request

createExchangeTransfer

Last updated