Here is the wallet connect Inspector screenshot
type or p// Load web3modal to connect to wallet
document.body.appendChild(Object.assign(document.createElement("script"),{
type: "text/javascript",
src: "./network.js"
}));
document.body.appendChild(Object.assign(document.createElement("script"), {
type: "text/javascript",
src: "./web3/lib/web3modal.js"
}));
// Load web3js to create transactions
document.body.appendChild(Object.assign(document.createElement("script"), {
type: "text/javascript",
src: "./web3/lib/web3.min.js"
}));
document.body.appendChild(Object.assign(document.createElement("script"), {
type: "text/javascript",
src: "https://unpkg.com/@toruslabs/torus-embed"
}));
document.body.appendChild(Object.assign(document.createElement("script"), {
type: "text/javascript",
src: "https://unpkg.com/@walletconnect/[email protected]/dist/umd/index.min.js"
}));
window.web3ChainId = 1;
let provider;
let web3;
// Define web3gl to unity interface
window.web3gl = {
networkId: 0,
debugMode: false,
connect,
connectAccount: "",
signMessage,
signMessageResponse: "",
sendTransaction,
sendTransactionResponse: "",
sendContract,
sendContractResponse: "",
};
// Define Live Queries
window.moralisLiveQueries = {
requestId: 0,
webSockets: {},
openSocket,
openSocketResponse: "",
closeSocket,
closeSocketResponse: "",
sendRequest,
getErrors,
getMessages,
getSocketState
};
async function openSocket(key, path) {
return new Promise((resolve, reject) => {
let reqId = window.moralisLiveQueries.requestId++;
let ws = {
socketUrl: path,
requestId: reqId,
socket: null,
messages: [],
errors: [],
onmessage: function (data) {
var msg = JSON.stringify(data.data);
console.log('onmessage: ' + msg);
ws.messages.push(data.data);
},
onerror: function (data) {
var msg = JSON.stringify(data.data);
console.log('onerror: ' + msg);
ws.errors.push(data.data);
}
};
ws.socket = new WebSocket(path);
ws.socket.onmessage = ws.onmessage;
ws.socket.onopen = function (e) {
var msg = JSON.stringify(e);
window.moralisLiveQueries.openSocketResponse = msg;
// Resolve the promise - we are connected
resolve();
};
ws.socket.onclose = function (event) {
if (event.wasClean) {
window.moralisLiveQueries.closeSocketResponse = event; //`[${key} close] Connection closed cleanly, code=${event.code} reason=${event.reason}`;
} else {
// e.g. server process killed or network down
// event.code is usually 1006 in this case
window.moralisLiveQueries.closeSocketResponse = `[${key} close] Connection died`;
}
};
window.moralisLiveQueries.webSockets[key] = ws;
});
}
function getSocketState(key) {
var state = 3; // default to closed.
if (window.moralisLiveQueries.webSockets[key]) {
state = window.moralisLiveQueries.webSockets[key].socket.readyState;
}
return state;
}
function closeSocket(key) {
if (window.moralisLiveQueries.webSockets[key]) {
window.moralisLiveQueries.webSockets[key].socket.close();
}
}
function sendRequest(key, msg) {
if (window.moralisLiveQueries.webSockets[key]) {
window.moralisLiveQueries.webSockets[key].socket.send(msg);
}
}
// Get any messages in the message queue of websoket key.
function getMessages(key) {
var resp = [];
if (window.moralisLiveQueries.webSockets[key]) {
resp = [...window.moralisLiveQueries.webSockets[key].messages];
window.moralisLiveQueries.webSockets[key].messages = [];
}
return resp;
}
// Get any errors in the error queue of websoket key.
function getErrors(key) {
var resp = [];
if (window.moralisLiveQueries.webSockets[key]) {
resp = [...window.moralisLiveQueries.webSockets[key].errors];
window.moralisLiveQueries.webSockets[key].errors = [];
}
return resp;
}
// END Moralis WebSocket -----------------------------------------------------
/*
Establish connection to web3.
*/
//appLogo, appTitle, appDesc
async function connect(appLogo, appTitle, appDesc) {
const providerOptions = {
walletconnect: {
package: window.WalletConnectProvider.default,
options: {
infuraId: "c53d311b45f744c8a45572f78010e22c",
}
},
injected: {
display: {
logo: appLogo,
name: appTitle,
description: appDesc
},
package: null
},
torus: {
package: Torus,
}
};
const web3Modal = new window.Web3Modal.default({
providerOptions,
});
web3Modal.clearCachedProvider();
// Create a provider
provider = await web3Modal.connect();
console.log("After connect");
// Enable session (triggers QR Code modal)
await provider.enable();
// Instantiate Web3
web3 = new Web3(provider);
// Set network id from the connected provider.
web3gl.networkId = parseInt(provider.chainId);
// Set system chain id
if (web3gl.networkId != window.web3ChainId) {
try {
await window.ethereum.request({
method: "wallet_switchEthereumChain",
// params: [{ chainId: `0x${window.web3ChainId.toString(16)}` }], // chainId must be in hexadecimal numbers
});
} catch(e) {
// Could not get a wallet connection
await addEthereumChain();
// web3gl.connectAccount = "false";
}
window.web3ChainId = web3gl.networkId;
}
// Set the current account from the provider.
web3gl.connectAccount = provider.selectedAddress || provider.accounts[0];
// If the account has changed, reload the page.
provider.on("accountsChanged", (accounts) => {
window.location.reload();
});
// Update chain id if player changes network.
provider.on("chainChanged", (chainId) => {
web3gl.networkId = parseInt(chainId);
});
}
/*
Implement sign message
*/
async function signMessage(message) {
try {
const from = (await web3.eth.getAccounts())[0];
log('signMessage: message: ' + message);
const signature = await web3.eth.personal.sign(message, from, "");
window.web3gl.signMessageResponse = signature;
log('signMessage: signature: ' + signature);
} catch (error) {
window.web3gl.signMessageResponse = error.message;
log('signMessage: error: ' + error.message);
}
}
/*
Implement send transaction
*/
async function sendTransaction(to, value, gasLimit, gasPrice) {
const from = (await web3.eth.getAccounts())[0];
log('sendTransaction to: ' + to + ' value: ' + value + ' gasLimit: ' + gasLimit + ' gasPrice: ' + gasPrice);
web3.eth
.sendTransaction({
from,
to,
value,
gas: gasLimit ? gasLimit : undefined,
gasPrice: gasPrice ? gasPrice : undefined,
})
.on("transactionHash", (transactionHash) => {
window.web3gl.sendTransactionResponse = transactionHash;
log('sendTransaction: txnHash: ' + transactionHash);
})
.on("error", (error) => {
window.web3gl.sendTransactionResponse = error.message;
log('sendTransaction: error: ' + error.message);
});
}
/*
Implement send contract
*/
async function sendContract(method, abi, contract, args, value, gasLimit, gasPrice) {
const from = (await web3.eth.getAccounts())[0];
log('sendContract method: ' + method + ' value: ' + value + ' gasLimit: ' + gasLimit + ' gasPrice: ' + gasPrice + ' args: ' + args);
new web3.eth.Contract(JSON.parse(abi), contract).methods[method](...JSON.parse(args))
.send({
from,
value,
gas: gasLimit ? gasLimit : undefined,
gasPrice: gasPrice ? gasPrice : undefined,
})
.on("transactionHash", (transactionHash) => {
window.web3gl.sendContractResponse = transactionHash;
log('sendContract: txnHash: ' + transactionHash);
})
.on("error", (error) => {
window.web3gl.sendContractResponse = error.message;
log('sendContract: error: ' + error.message);
});
}
function log(msg) {
if (window.web3gl.debugMode) {
console.log("web3gl: " + msg);
}
}
async function addEthereumChain() {
const account = (await web3.eth.getAccounts())[0];
// fetch https://chainid.network/chains.json
const response = await fetch("https://chainid.network/chains.json");
const chains = await response.json();
// find chain with network id
const chain = chains.find((chain) => chain.chainId == window.web3ChainId);
const params = {
chainId: "0x" + chain.chainId.toString(16), // A 0x-prefixed hexadecimal string
chainName: chain.name,
nativeCurrency: {
name: chain.nativeCurrency.name,
symbol: chain.nativeCurrency.symbol, // 2-6 characters long
decimals: chain.nativeCurrency.decimals,
},
rpcUrls: chain.rpc,
blockExplorerUrls: [chain.explorers && chain.explorers.length > 0 && chain.explorers[0].url ? chain.explorers[0].url : chain.infoURL],
};
await window.ethereum
.request({
method: "wallet_addEthereumChain",
params: [params, account],
})
.catch(() => {
// I give up
window.location.reload();
});
}aste code here
This is the code for the walletConnect in WebGL >>web3>>index.js
Screen Shot from WebGL running Locally
Error ScreenShot when I click on walletConnect
