1. Widget URL

Once you have completed your dashboard onboarding, you can start accessing your TransFi on and off ramp widget like below.

📘

Please replace [YOUR_STAGING_API_KEY] with your actual api key.

• Sign URLs for sensitive information:

Transfi is highly committed to security. For this reason, whenever sensitive information such as email or wallet addresses are transmitted to the widget, you are required to use the signature parameter, otherwise, the Transfi widget will not load. This measure makes it more difficult for unauthorized third parties to misuse the the widget's pre-fill feature.

A signed URL restricts access from unauthorized third parties by granting limited permissions and a limited time to make a request. If your URL includes parameters such as name, amount, walletAddress, or paymentCode, the signature parameter is required and must be appended at the end of the URL. Additionally, if your widget URL contains sensitive information, it is strongly recommended to use the signature parameter.

You can generate a signature of the URL server-side and append it to the end of the URL. If the signature is provided, we'll check the validity of the query string to make sure it has not been altered. If the signature is invalid for any reason the Transfi widget will fail to load.

In addition to implementing signed URLs, we will also enforce verification of the request source on the customer side. The endpoint responsible for generating the signed URL will require an authenticated user session (for example, a valid session cookie or bearer token). This ensures that signatures can only be generated for legitimate, authenticated user requests and helps prevent unauthorized signature generation.

• Signature Generation Process:

1. Compute an HMAC using the SHA-256 hash function.
2. Use your secret API key as the HMAC key found in your Transfi dashboard.
3. Use the original query string as the message when computing the HMAC.

 https://sandbox-buy.transfi.com/?apiKey=[YOUR_STAGING_API_KEY]&walletAddress={{walletAddress}}&signature={{signature}}

import crypto from 'crypto';

const originalUrl = 'https://sandbox-buy.transfi.com/?apiKey={{YOUR_STAGING_API_KEY}}&cryptoTicker=BTC&fiatTicker=AED&walletAddress=bc1q98pd9dsaq8zp9xfw46h3d9c0jejl6z5409aghw&cryptoAmount=0.001&country=AE&cryptoNetwork=Bitcoin&paymentCode=AE_BANK_TRANSFER&partnerContext=01KJ97J1HE8HZVM7MRMD1DF8RW&view=sell';

const signature = crypto  
.createHmac('sha256', 'sk_test_key')  
.update(new URL(originalUrl).search)  
.digest('base64');

const urlWithSignature = `${originalUrl}&signature=${encodeURIComponent(signature)}`;

• NOTE: Before generating the signature, ensure that all query parameter values are URL-encoded, including the signature parameter value itself (but not the entire query string). Proper encoding is required for the generated signature to be considered valid.
• RECOMMENDATION: Implement Invisible CAPTCHA for Additional Request Validation. To further strengthen request validation and prevent automated abuse, it is recommended to implement Invisible CAPTCHA on the customer platform, particularly on endpoints responsible for generating signed URLs or initiating sensitive API requests. Invisible CAPTCHA helps distinguish legitimate human users from automated scripts or bots without requiring explicit user interaction in most cases. Unlike traditional CAPTCHA challenges, invisible CAPTCHA runs in the background and only triggers a challenge when suspicious activity is detected.

2. Integration options

TransFi integrations are adaptable to fit any type of app with mobile native SDK's and browser integration. Choose the platform or programming language that powers your app from the options below for step-by-step instructions on adding TransFi.

3. Pick your SDK's and environment

Please go to the appropriate SDK page from the below table and follow all the instruction in your SDK page.