const serverUrl = "https://zzhjcn4ygdfm.usemoralis.com:2053/server"; //Server url from moralis.io
const appId = "WuvN4cMUDRlGEvoVDFE0sU812V4wf0nNmne0GTC5"; // Application id from moralis.io
let currentTrade = {};
let currentSelectSide;
let tokens;
async function init() {
await Moralis.start({ serverUrl, appId });
await Moralis.enableWeb3();
await listAvailableTokens();
currentUser = Moralis.User.current();
if (currentUser) {
document.getElementById("swap_button").disabled = false;
}
}
async function listAvailableTokens() {
const result = await Moralis.Plugins.oneInch.getSupportedTokens({
chain: "bsc", // The blockchain you want to use (eth/bsc/polygon)
});
tokens = result.tokens;
let parent = document.getElementById("token_list");
for (const address in tokens) {
let token = tokens[address];
let div = document.createElement("div");
div.setAttribute("data-address", address);
div.className = "token_row";
let html = `
<img class="token_list_img" src="${token.logoURI}">
<span class="token_list_text">${token.symbol}</span>
`;
div.innerHTML = html;
div.onclick = () => {
selectToken(address);
};
parent.appendChild(div);
}
}
function selectToken(address) {
closeModal();
console.log(tokens);
currentTrade[currentSelectSide] = tokens[address];
console.log(currentTrade);
renderInterface();
getQuote();
}
function renderInterface() {
if (currentTrade.from) {
document.getElementById("from_token_img").src = currentTrade.from.logoURI;
document.getElementById("from_token_text").innerHTML = currentTrade.from.symbol;
}
if (currentTrade.to) {
document.getElementById("to_token_img").src = currentTrade.to.logoURI;
document.getElementById("to_token_text").innerHTML = currentTrade.to.symbol;
}
}
async function login() {
try {
currentUser = Moralis.User.current();
if (!currentUser) {
currentUser = await Moralis.authenticate();
}
document.getElementById("swap_button").disabled = false;
} catch (error) {
console.log(error);
}
}
function openModal(side) {
currentSelectSide = side;
document.getElementById("token_modal").style.display = "block";
}
function closeModal() {
document.getElementById("token_modal").style.display = "none";
}
async function getQuote() {
if (!currentTrade.from || !currentTrade.to || !document.getElementById("from_amount").value) return;
let amount = Number(document.getElementById("from_amount").value * 10 ** currentTrade.from.decimals);
const quote = await Moralis.Plugins.oneInch.quote({
chain: "bsc", // The blockchain you want to use (eth/bsc/polygon)
fromTokenAddress: currentTrade.from.address, // The token you want to swap
toTokenAddress: currentTrade.to.address, // The token you want to receive
amount: amount,
});
console.log(quote);
document.getElementById("gas_estimate").innerHTML = quote.estimatedGas;
document.getElementById("to_amount").value = quote.toTokenAmount / 10 ** quote.toToken.decimals;
}
async function trySwap() {
let address = Moralis.User.current().get("ethAddress");
let amount = Number(document.getElementById("from_amount").value * 10 ** currentTrade.from.decimals);
if (currentTrade.from.symbol !== "ETH") {
const allowance = await Moralis.Plugins.oneInch.hasAllowance({
chain: "bsc", // The blockchain you want to use (eth/bsc/polygon)
fromTokenAddress: currentTrade.from.address, // The token you want to swap
fromAddress: address, // Your wallet address
amount: amount,
});
console.log(allowance);
if (!allowance) {
await Moralis.Plugins.oneInch.approve({
chain: "bsc", // The blockchain you want to use (eth/bsc/polygon)
tokenAddress: currentTrade.from.address, // The token you want to swap
fromAddress: address, // Your wallet address
});
}
}
try {
let receipt = await doSwap(address, amount);
alert("Swap Complete");
} catch (error) {
console.log(error);
}
}
function doSwap(userAddress, amount) {
return Moralis.Plugins.oneInch.swap({
chain: "bsc", // The blockchain you want to use (eth/bsc/polygon)
fromTokenAddress: currentTrade.from.address, // The token you want to swap
toTokenAddress: currentTrade.to.address, // The token you want to receive
amount: amount,
fromAddress: userAddress, // Your wallet address
slippage: 1,
});
}
init();
document.getElementById("modal_close").onclick = closeModal;
document.getElementById("from_token_select").onclick = () => {
openModal("from");
};
document.getElementById("to_token_select").onclick = () => {
openModal("to");
};
document.getElementById("login_button").onclick = login;
document.getElementById("from_amount").onblur = getQuote;
document.getElementById("swap_button").onclick = trySwap;
you could try to look there in network tab to see what parameters were sent to that function when it returns that error
whit others token the swap work onl whit bnb dont work
There may be some requests that donβt return status code 200 and that are in red
yes there are ! see in first screeshot some request of token list is in red give error 404 or 500
I mean, there has to be a request that is sending some parameters and returns that invalid parameters response
i have donwload the code from boilerplate only change eth to bsc
you can try to see what parameters were sent (in network tab in the browser), maybe it will give us some info about what happens
i cant fix i dont know if is my problem ora server problem
does it work in other circumstances?
i have try also whit eth network and same error but only 1 token left in red
*{font-family: 'Teko',sans-serif; font-size: larger;}
#nav-color{background-color: rgb(0, 0, 0);border-radius: 40px; text-decoration: aqua;}
#nh2dex{color: rgb(0, 255, 128);}
#login_button{color: rgb(0, 255, 128);}
#stake{color: rgb(0, 255, 128);}
#swap_button{background-color: rgb(81, 204, 81);text-decoration-color: aqua; color: rgb(0, 0, 0);}
#window{
margin-top: 50px;
background-color: rgb(0, 0, 0);
color: #fff;
padding: 15px;
border: 20px;
box-shadow: 0 0 5px black;
}
.swapbox_select {
width: 50%;
float: left;
}
.swapbox{
overflow: auto;
margin: 20px 0;
padding: 20px;
background-color: #000000;
border-radius: 20px;
border: 1px solid #565656;
font-size: small;
}
.token_select{
padding:5px 0;
background-image:url();
}
.token_select:hover{
background-color: #464646;
cursor: pointer;
}
.token_list_img, .token_image{
width: 40px;
}
.modal-body{
height: 600px;
overflow: scroll;
background-color: rgb(96, 196, 209);
font-size: small;
}
.token_row{
padding: 2px 5px;
}
.token_row:hover{
background-color: #e4e4e4;
cursor: pointer;
}
#gas{
font-size: medium;
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!--load all Font Awesome styles -->
<link href="/fontawsom/css/all.css" rel="stylesheet">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Teko:[email protected]&display=swap" rel="stylesheet">
<title>nh2 dex</title>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/web3.min.js"></script>
<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
<script src="https://unpkg.com/moralis/dist/moralis.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
<link rel="stylesheet" href="./style.css">
</head>
<body>
<nav class="navbar navbar-expand-lg navbar-light bg-light" id="nav-color">
<a class="navbar-brand" href="#" id="nh2dex">NH2 DEX</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="#" id="stake">staking <span class="sr-only">(current)</span></a>
</li>
</ul>
<button id="login_button" class="btn btn-outline-primary my-2 my-sm-0" type="submit">Sign in with Metamask</button>
</div>
</nav>
<div class="container" id="body">
<div class="row">
<div class="col col-md-6 offset-md-3" id="window">
<h4>Swap tools</h4>
<div id="form">
<div class="swapbox">
<div class="swapbox_select token_select" id="from_token_select">
<img class="token_image" id="from_token_img">
<span id="from_token_text"></span><i class="fa-solid fa-magnifying-glass-plus"></i>
</div>
<div class="swapbox_select">
<input class="number form-control" placeholder="amount" id="from_amount">
</div>
</div>
<div class="swapbox">
<div class="swapbox_select token_select" id="to_token_select">
<img class="token_image" id="to_token_img">
<span id="to_token_text"></span><i class="fa-solid fa-magnifying-glass-plus"></i>
</div>
<div class="swapbox_select">
<input class="number form-control" placeholder="amount" id="to_amount">
</div>
</div>
<div id="gas">Estimated Gas: <span id="gas_estimate"></span><i class="fa-solid fa-gas-pump"></i></div>
<button disabled class="btn btn-large btn-primary btn-block" id="swap_button">
Swap
</button>
</div>
</div>
</div>
</div>
<div class="modal" id="token_modal" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Select token</h5>
<button id="modal_close" type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div id="token_list"></div>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="./main.js"></script>
</body>
</html>
const serverUrl = "https://nyslsg8amua5.usemoralis.com:2053/server"; //Server url from moralis.io
const appId = "1C1I8lL8UmBdYkzCtlMmkZWNGA0I73ymrk4w2ToJ"; // Application id from moralis.io
let currentTrade = {};
let currentSelectSide;
let tokens;
async function init() {
await Moralis.start({ serverUrl, appId });
await Moralis.enableWeb3();
await listAvailableTokens();
currentUser = Moralis.User.current();
if (currentUser) {
document.getElementById("swap_button").disabled = false;
}
}
async function listAvailableTokens() {
const result = await Moralis.Plugins.oneInch.getSupportedTokens({
chain: "eth", // The blockchain you want to use (eth/bsc/polygon)
});
tokens = result.tokens;
let parent = document.getElementById("token_list");
for (const address in tokens) {
let token = tokens[address];
let div = document.createElement("div");
div.setAttribute("data-address", address);
div.className = "token_row";
let html = `
<img class="token_list_img" src="${token.logoURI}">
<span class="token_list_text">${token.symbol}</span>
`;
div.innerHTML = html;
div.onclick = () => {
selectToken(address);
};
parent.appendChild(div);
}
}
function selectToken(address) {
closeModal();
console.log(tokens);
currentTrade[currentSelectSide] = tokens[address];
console.log(currentTrade);
renderInterface();
getQuote();
}
function renderInterface() {
if (currentTrade.from) {
document.getElementById("from_token_img").src = currentTrade.from.logoURI;
document.getElementById("from_token_text").innerHTML = currentTrade.from.symbol;
}
if (currentTrade.to) {
document.getElementById("to_token_img").src = currentTrade.to.logoURI;
document.getElementById("to_token_text").innerHTML = currentTrade.to.symbol;
}
}
async function login() {
try {
currentUser = Moralis.User.current();
if (!currentUser) {
currentUser = await Moralis.authenticate();
}
document.getElementById("swap_button").disabled = false;
} catch (error) {
console.log(error);
}
}
function openModal(side) {
currentSelectSide = side;
document.getElementById("token_modal").style.display = "block";
}
function closeModal() {
document.getElementById("token_modal").style.display = "none";
}
async function getQuote() {
if (!currentTrade.from || !currentTrade.to || !document.getElementById("from_amount").value) return;
let amount = Number(document.getElementById("from_amount").value * 10 ** currentTrade.from.decimals);
const quote = await Moralis.Plugins.oneInch.quote({
chain: "eth", // The blockchain you want to use (eth/bsc/polygon)
fromTokenAddress: currentTrade.from.address, // The token you want to swap
toTokenAddress: currentTrade.to.address, // The token you want to receive
amount: amount,
});
console.log(quote);
document.getElementById("gas_estimate").innerHTML = quote.estimatedGas;
document.getElementById("to_amount").value = quote.toTokenAmount / 10 ** quote.toToken.decimals;
}
async function trySwap() {
let address = Moralis.User.current().get("ethAddress");
let amount = Number(document.getElementById("from_amount").value * 10 ** currentTrade.from.decimals);
if (currentTrade.from.symbol !== "ETH") {
const allowance = await Moralis.Plugins.oneInch.hasAllowance({
chain: "eth", // The blockchain you want to use (eth/bsc/polygon)
fromTokenAddress: currentTrade.from.address, // The token you want to swap
fromAddress: address, // Your wallet address
amount: amount,
});
console.log(allowance);
if (!allowance) {
await Moralis.Plugins.oneInch.approve({
chain: "eth", // The blockchain you want to use (eth/bsc/polygon)
tokenAddress: currentTrade.from.address, // The token you want to swap
fromAddress: address, // Your wallet address
});
}
}
try {
let receipt = await doSwap(address, amount);
alert("Swap Complete");
} catch (error) {
console.log(error);
}
}
function doSwap(userAddress, amount) {
return Moralis.Plugins.oneInch.swap({
chain: "eth", // The blockchain you want to use (eth/bsc/polygon)
fromTokenAddress: currentTrade.from.address, // The token you want to swap
toTokenAddress: currentTrade.to.address, // The token you want to receive
amount: amount,
fromAddress: userAddress, // Your wallet address
slippage: 1,
});
}
init();
document.getElementById("modal_close").onclick = closeModal;
document.getElementById("from_token_select").onclick = () => {
openModal("from");
};
document.getElementById("to_token_select").onclick = () => {
openModal("to");
};
document.getElementById("login_button").onclick = login;
document.getElementById("from_amount").onblur = getQuote;
document.getElementById("swap_button").onclick = trySwap;
this is the entire folder whit ethereum server mainnet