Hello all. I am having a problem when trying to get a quote from 1inch. I seem to be having a problem with line 39 when fetching the 1inchAPI. I get a status code saying the following {statusCode: 400, error: “Bad Request”, description: “undefined is wrong address”,…}.
Line 39 is
const response = await fetch(url);
Here is my code below.
async function getTop10Tokens() {
const response = await fetch('https://api.coinpaprika.com/v1/coins');
const tokens = await response.json();
return tokens
.filter(token=> token.rank>= 1 && token.rank <= 10)
.map(token => token.symbol);
}
async function getTickerData(tickerList) {
const response = await fetch('https://api.1inch.exchange/v3.0/56/tokens');
const tokens = await response.json();
const tokenList = Object.values(tokens.tokens);
return tokenList.filter(token => tickerList.includes(token.symbol))
}
function renderForm(tokens) {
const options = tokens.map(token =>
`<option value= "${token.decimals}-${token.address}">${token.name} (${token.symbol})</option>`)
console.log(tokens);
console.log(options.join(''));
document.querySelector('[name= from-token]').innerHTML=options;
document.querySelector('[name= to-token]').innerHTML=options;
}
async function formSubmitted(event) {
event.preventDefault();
const fromToken =document.querySelector('[name= from-token]').value;
const toToken = document.querySelector('[name= to-token]').value;
const [fromDecimals, fromAddress]= fromToken.split('-');
const [toDecimals, toAddress]= toToken.split('-');
const fromUnit= 10 ** fromDecimals;
const url= `https://api.1inch.exchange/v3.0/56/quote?fromTokenAddress=${fromAddress}&toTokenAddress${toAddress}&amount=${fromUnit}`;
const response = await fetch(url);
const quote= await response.json();
const exchange_rate= Number(quote.toTokenAmount) / Number(quote.FromTokenAmount);
document.querySelector('.js-quote-container').innerHTML = `
<h2>1 ${quote.fromToken.symbol} = ${exchange_rate} ${quote.toToken.symbol} </h2>
`;
}
document.querySelector('.js-submit-quote')
.addEventListener('click', formSubmitted);
getTop10Tokens()
.then(getTickerData)
.then(renderForm)
Here is the HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="./styles.css">
</head>
<body>
<form action="#" method="POST" class="exchange-form">
<div class="form-row">
<label> From
<select name="from-token" id=""></select>
</label>
</div>
<div class="form-row">
<label> To
<select name="to-token" id=""></select>
</label>
</div>
<div class="form-row">
<button type="submit" class="js-submit-quote"> Get Quote</button>
</div>
</form>
<div class="js-quote-container"></div>
<script src="./dex.js"></script>
</body>
</html>
If anyone could help I would appreciate it so much!
