I have created a test contract and deployed on Remix:
pragma solidity ^0.4.24;
contract Message {
string myMessage;
function setMessage(string x) public {
myMessage = x;
}
function getMessage() public view returns (string) {
return myMessage;
}
}
I have created a .html file containing a JS code using Web3 to use Metamask and Goerli testnet.
Here it is the code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Deploy a Remix Contract</title>
<link rel="stylesheet" type="text/css" href="main.css">
<script src="https://cdn.jsdelivr.net/gh/ethereum/web3.js/dist/web3.min.js"></script>
</head>
<body>
<div>
<h1>Ethereum Secret Messenger</h1>
<hr>
<label for="message">This site writes a secret message to the Ethereum
blockchain!</label>
<input id="userInput" type="text">
<button id="setMessageButton">Set secret message</button>
<button id="getMessageButton">Get secret message</button>
<!-- <button class="enableEthereumButton">Enable Ethereum</button> -->
</div>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"></script>
<script>
async function interact() {
// Connect a the web3 provider
if (typeof web3 !== 'undefined') {
web3 = new Web3(window.ethereum);
console.log("Metamask!")
await window.ethereum.enable();
} else {
web3 = new Web3(new Web3.providers.HttpProvider("http://localhost:7545"));
}
console.log(web3);
const providersAccounts = await web3.eth.getAccounts();
const defaultAccount = providersAccounts[0];
// Get the contract address
var RemixContract = new web3.eth.Contract(
[
{
"constant": false,
"inputs": [
{
"name": "x",
"type": "string"
}
],
"name": "setMessage",
"outputs": [],
"payable": false,
"stateMutability": "nonpayable",
"type": "function"
},
{
"constant": true,
"inputs": [],
"name": "getMessage",
"outputs": [
{
"name": "",
"type": "string"
}
],
"payable": false,
"stateMutability": "view",
"type": "function"
}
], '0x7255c7F5a89af3aF7b2e8d4B56a154373462FD10'
);
$("#setMessageButton").click(function () {
console.log(defaultAccount)
let receipt;
try {
(async () => {
receipt = await RemixContract.methods.setMessage($("#userInput").val()).send({
from: defaultAccount,
gas: 1000000,
gasPrice: 10000000000,
});
console.log($("#userInput").val());
console.log(RemixContract);
} )()
} catch (err) {
console.log(err);
}
});
$("#getMessageButton").click(function () {
let mess;
(async () => {
mess = await RemixContract.methods.getMessage().call();
console.log(mess);
} )()
});
};
interact();
</script>
</body>
</html>
I can set the message, but cannot get the message. I get this error message:
Uncaught (in promise) Error: Returned values aren't valid, did it run Out of Gas? You might also see this error if you are not using the correct ABI for the contract you are retrieving data from, requesting data from a block number that does not exist, or querying a node which is not fully synced.
Since the getMessage function just returns the message, I am using the .call() function, but it doesn't work.
Thanks in advance.
