How to Approve spend of one Token with Web3.js?
Question
I seek via my web page of test to create a button which allows to authorize the expenditure of a Contract (Token).. If I go to the page and I click I would like the script to load web3 (it loads well) then if I press the button that Metamask authorizes the spending of the contract.
Metamask opens fine and does request the connection for my test site on the BSC in Web3js. However I can't find the exact code for the approve function.
Here is the code:
<head>
<script src='https://cdnjs.cloudflare.com/ajax/libs/web3/1.7.0/web3.min.js'></script>
</head>
<button onclick="approvebutton();">Approve button to authorize tokens to be spent</button>
<script type="text/javascript">
if (typeof window.ethereum !== 'undefined') {
ethereum.request({ method: 'eth_requestAccounts' });
} else {
alert('Please install metamask')
}
var Web3 = require('web3');
const web3 = new Web3('https://bsc-dataseed1.binance.org:443');
async function approvebutton() {
/// APPROVE FUNCTION WITH THE CONTRACT
}
</script>
I tried this approach but it doesn't work (metamask confirmation won't show up):
if (typeof window.ethereum !== 'undefined') {
ethereum.request({ method: 'eth_requestAccounts' });
} else {
alert('Please install metamask')
}
var Web3 = require('web3');
const web3 = new Web3('https://bsc-dataseed1.binance.org:443');
const Contract = ('0xContractAddress');
const spenderAdr = ('0xSpenderAddress');
const amount = ('AmountTokensNumber')
async function approvebutton(Contract,spenderAdr){
Contract.methods.approve(spenderAddr, amount).send({
from: ownerAddr
})
}
Metamask won't show up to confirm the TX.
2 answers
solution1
0 2022-03-17 07:18:07
First of all, the approve method takes 2 parameters, the spender and the amount so it will be something like this:
Contract.methods.approve(spenderAddr, amount).send({
from: ownerAddr
})
The gas parameter is optional.
solution2
0 2022-08-12 23:59:52
From the example code, I think you're missing the ABI (or Json Interface) for the contract and the instantiation of the contract via web3.eth.Contract() with the ABI and the contract address.
var Contract = new web3.eth.Contract(jsonInterface[, address][, options])
From that Contract instance you can then call the methods in the ABI, and that should trigger the Metamask modal.
From the docs:
Contract.methods.myMethod(123).send({from: '0xde0B295669a9FD93d5F28D9Ec85E40f4cb697BAe'})
.then(function(receipt){
// receipt can also be a new contract instance, when coming from a "contract.deploy({...}).send()"
});
Or in your case, something along the lines of:
await Contract.methods.approve(spenderAddr, amount).send({ from: ownerAddr })
I also think that you're missing an await inside the approvebutton() function, to await the "promisevent" that the method call on the contract returns.
( Source https://web3js.readthedocs.io/en/v1.2.11/web3-eth-contract.html# , https://web3js.readthedocs.io/en/v1.2.11/web3-eth-contract.html#id26 )
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.