当前位置:   article > 正文

js连接web3,连接小狐狸metamask钱包,实现链不对后切换网络和创建网络_vue 小狐狸切换网络

vue 小狐狸切换网络

直接上代码,我这里吧所有配置都改成正式的链56,一旦用户的小狐狸钱包现在的链不一致,就询问切换网络,没有就创建网络,网络切换成功后,收到监听,重新连接一下web3,就是重新调用一些connectWeb3这个方法,再连接合约

  1. connectWeb3: async function () {
  2. // 判断链对不,链不对就请求切换网络,或者添加网络,
  3. if (window.ethereum) {
  4. try {
  5. await (window.ethereum as any).request({
  6. method: 'wallet_switchEthereumChain',
  7. params: [{
  8. chainId: Web3.utils.numberToHex(56) // 目标链ID
  9. }]
  10. })
  11. } catch (e) {
  12. if ((e as any).code === 4902) {
  13. try {
  14. await (window.ethereum as any).request({
  15. method: 'wallet_addEthereumChain',
  16. params: [
  17. {
  18. chainId: Web3.utils.numberToHex(56), // 目标链ID
  19. chainName: 'Binance Smart Chain Mainnet',
  20. nativeCurrency: {
  21. name: 'bnb',
  22. symbol: 'bnb',
  23. decimals: 18
  24. },
  25. rpcUrls: ['https://bsc-dataseed.binance.org'], // 节点
  26. blockExplorerUrls: ['https://www.bscscan.com']
  27. }
  28. ]
  29. })
  30. } catch (ee) {
  31. //
  32. }
  33. } else if ((e as any).code === 4001) return
  34. }
  35. }
  36. // 监听账户变化
  37. const func: Function = async function (accounts) {
  38. _this.account = accounts[0];
  39. if (_this.isConnect) {
  40. console.log("Contract Account Changed");
  41. _this.init();// 清空数据
  42. _this.connectWeb3();// 链变化,然后重新调用此方法,连接web3
  43. }
  44. };
  45. let web3Provider: any = null;
  46. if (window.ethereum) {
  47. (window.ethereum as any).autoRefreshOnNetworkChange = false;
  48. (window.ethereum as any).on("accountsChanged", func);
  49. // 监听链id变化
  50. (window.ethereum as any).on("chainChanged", (chainId1) => {
  51. console.log("Chain Changed");
  52. _this.chainId = chainId1;
  53. func([_this.account]);
  54. });
  55. web3Provider = window.ethereum;
  56. try {
  57. await (window.ethereum as any).enable();
  58. } catch (error) {
  59. console.error("User denied account access");
  60. }
  61. } else if (window.web3) {
  62. web3Provider = window.web3.currentProvider;
  63. } else {
  64. web3Provider = new
  65. Web3.providers.HttpProvider(ChainLink[TargetChainId.toString()]);// 连接rpc网络
  66. }
  67. _this.web3 = new Web3(web3Provider);
  68. _this.web3.eth.getAccounts(function (error, result) {
  69. if (!error) console.log(result);
  70. });
  71. _this.isConnect = true;
  72. _this.account = (window.ethereum as any).selectedAddress || null;
  73. _this.chainId = (window.ethereum as any).networkVersion || null;
  74. if(_this.chainId!=TargetChainId) return;// 链不对,就不去连接合约了
  75. if (_this.account) {
  76. const time = Math.round(new Date().valueOf() / 1000);
  77. // 签名
  78. _this.web3.eth.personal.sign("Sign this message to login Game." + time, _this.account)
  79. .then((res) => {
  80. _this.signature = res + "|" + time;
  81. });
  82. _this.connectContract();// 连接合约
  83. }
  84. return _this.account;
  85. }

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/寸_铁/article/detail/861593
推荐阅读
  

闽ICP备14008679号