Ready to integrate DEX aggregation into your Solana DApp? This tutorial shows you how to interact with the OKX DEX API to perform token swaps on the Solana blockchain. Your implementation will use Web3.js and the OKX DEX API to create robust handling of quotes and swap execution. By default, this implementation demonstrates:
This tutorial focuses on implementing dexUtils.js, a utility file that contains all the necessary functions for interacting with the OKX DEX API on Solana. This file handles:
Before beginning, you need:
You have two options to get started:
git clone https://github.com/Julian-dev28/okx-os-evm-swap-app.git cd okx-os-evm-swap-app git checkout solana-cross-chain-swap
npm install
REACT_APP_API_KEY=your_api_key REACT_APP_SECRET_KEY=your_secret_key REACT_APP_API_PASSPHRASE=your_passphrase REACT_APP_PROJECT_ID=your_project_id REACT_APP_USER_ADDRESS=your_wallet_address REACT_APP_PRIVATE_KEY=your_private_key
Fork the Replit project:
OKX Solana Swap App
Add your environment variables in the Replit Secrets tab (located in the Tools panel):
Click "Run" to start your development environment
Let's set up our configuration for interacting with Solana:
import { Connection } from "@solana/web3.js";
import base58 from "bs58";
import cryptoJS from "crypto-js";
// Constants for tokens and chain
export const NATIVE_SOL = "11111111111111111111111111111111";
export const WRAPPED_SOL = "So11111111111111111111111111111111111111112";
export const USDC_SOL = "EPjFWdd5AufqSSqeM2qN1xzybapC8G4wEGGkZwyTDt1v";
export const SOLANA_CHAIN_ID = "501";
// Initialize Solana connection
export const connection = new Connection("https://mainnet.helius-rpc.com/?api-key=<API_KEY>", {
confirmTransactionInitialTimeout: 5000,
wsEndpoint: "wss://mainnet.helius-rpc.com/?api-key=<API_KEY>",
});
// Environment variables for API authentication
const apiKey = process.env.REACT_APP_API_KEY;
const secretKey = process.env.REACT_APP_SECRET_KEY;
const apiPassphrase = process.env.REACT_APP_API_PASSPHRASE;
const projectId = process.env.REACT_APP_PROJECT_ID;
// Base URL for API requests
const apiBaseUrl = "https://www.okx.com/api/v5/dex";
Before executing a swap, we need to get a quote. Here's how to implement the quote functionality:
/**
* Gets swap data and optimal route from the OKX DEX API
* Note: Requires API credentials from OKX Developer Portal
*
* @param {Object} params
* @param {string} params.chainId - "501" for Solana
* @param {string} params.amount - Amount in lamports (1 SOL = 1e9 lamports)
* @param {string} params.fromTokenAddress - Source token (e.g., NATIVE_SOL)
* @param {string} params.toTokenAddress - Destination token (e.g., USDC_SOL)
* @param {string} params.slippage - Slippage tolerance ("0.5" for 0.5%)
* @param {string} params.userWalletAddress - Solana wallet address
* @returns {Promise<Object>} Contains routerResult.toTokenAmount and transaction data
*/
export async function getSingleChainSwap(params) {
if (!apiKey || !secretKey || !apiPassphrase || !projectId) {
throw new Error("Missing API credentials");
}
const timestamp = new Date().toISOString();
const requestPath = "/api/v5/dex/aggregator/swap";
const queryString = "?" + new URLSearchParams(params).toString();
const headers = getHeaders(timestamp, "GET", requestPath, queryString);
console.log("Requesting swap quote with params:", params);
const response = await fetch(
`https://www.okx.com${requestPath}${queryString}`,
{ method: "GET", headers }
);
const data = await response.json();
if (data.code !== "0") {
throw new Error(`API Error: ${data.msg}`);
}
if (!data.data?.[0]?.routerResult?.toTokenAmount) {
throw new Error("Invalid or missing output amount");
}
return data.data[0];
}
Here's the implementation for executing swap transactions on Solana:
/**
* Executes a Solana transaction with retry logic and compute budget
* @param {Object} txData - Transaction data from the API
* @returns {Promise<Object>} Transaction result with explorer URL
*/
export async function executeTransaction(txData) {
if (!userPrivateKey) {
throw new Error("Private key not found");
}
try {
// Get recent blockhash for transaction validity
const recentBlockHash = await connection.getLatestBlockhash();
const decodedTransaction = base58.decode(txData.data);
// Create transaction object
const tx = solanaWeb3.Transaction.from(decodedTransaction);
tx.recentBlockhash = recentBlockHash.blockhash;
// Create and add keypair for signing
const feePayer = solanaWeb3.Keypair.fromSecretKey(
base58.decode(userPrivateKey)
);
tx.partialSign(feePayer);
// Send transaction with retry options
const txId = await connection.sendRawTransaction(tx.serialize(), {
skipPreflight: false,
maxRetries: 5
});
// Wait for confirmation
const confirmation = await connection.confirmTransaction({
signature: txId,
blockhash: recentBlockHash.blockhash,
lastValidBlockHeight: recentBlockHash.lastValidBlockHeight
}, 'confirmed');
return {
success: true,
transactionId: txId,
explorerUrl: `https://solscan.io/tx/${txId}`,
confirmation
};
} catch (error) {
console.error("Transaction failed:", error);
throw error;
}
}
The SolanaSwapTransaction component demonstrates how to implement the DEX API calls in a React interface:
git clone https://github.com/Julian-dev28/okx-os-evm-swap-app.git cd okx-os-evm-swap-app git checkout solana-cross-chain-swap
Found this helpful? Don't forget to check out the boilerplate code and documentation linked above. Join the OKX OS Community to connect with other developers, and follow Julian on Twitter for more Solana development content!
This content is provided for informational purposes only and may cover products that are not available in your region. It represents the views of the author(s) and it does not represent the views of OKX. It is not intended to provide (i) investment advice or an investment recommendation; (ii) an offer or solicitation to buy, sell, or hold digital assets, or (iii) financial, accounting, legal, or tax advice. Digital asset holdings, including stablecoins and NFTs, involve a high degree of risk and can fluctuate greatly. You should carefully consider whether trading or holding digital assets is suitable for you in light of your financial condition. Please consult your legal/tax/investment professional for questions about your specific circumstances. Information (including market data and statistical information, if any) appearing in this post is for general information purposes only. While all reasonable care has been taken in preparing this data and graphs, no responsibility or liability is accepted for any errors of fact or omission expressed herein. Both OKX Web3 Wallet and OKX NFT Marketplace are subject to separate terms of service at www.okx.com.
© 2024 OKX. This article may be reproduced or distributed in its entirety, or excerpts of 100 words or less of this article may be used, provided such use is non-commercial. Any reproduction or distribution of the entire article must also prominently state: “This article is © 2024 OKX and is used with permission.” Permitted excerpts must cite to the name of the article and include attribution, for example “Integrate the OKX DEX Widget in Just 30 Minutes, Julian Martinez, © 2024 OKX.” No derivative works or other uses of this article are permitted.
© 2024 OKX. All rights reserved.
The above is the detailed content of OKX DEX API Guide: Building a Solana Token Swap Interface. For more information, please follow other related articles on the PHP Chinese website!
The role of applet tag in html
A complete list of commonly used public dns
How to open bak file
ps brightness contrast shortcut keys
Session failure solution
mobile phone screen tft
The difference between static web pages and dynamic web pages
The difference between arrow functions and ordinary functions
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
