html通过web3JS 获取当前连接的区块链信息和账号信息

news2024/11/19 15:21:58

前面 我们讲了 MetaMask和ganache的配置安装 并用 MetaMask管理ganache的启动的虚拟区块链
那么 我们现在也完全可以写一个网页来做这个东西的管理

您可以先查看文章web3.js获取导入做一个导入了 web3的html文件

首先我们可以来试着 获取 自己当前是在哪个区块的
getBlockNumber
当然 你要有本地的区块链 我们还是通过ganache启动起虚拟的环境
然后在网页中编写

<!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>
    <script src = "./js/web3.min.js"></script>
</head>
<body>
    <script>
        var web3 = new Web3(Web3.givenProvider || "ws://localhost:8545");
        web3.eth.getBlockNumber().then(res =>{
            console.log(res);
        })
    </script>
</body>
</html>

这里 就输出了我们的区块链编号
在这里插入图片描述
如果你是刚起来的环境 自然就是0 如果中间你做过其他操作 可能就会向后退 变成 1 2 3 4 5

我们在运行 ganache 时 会出现一个链id
在这里插入图片描述
web3就可以获取到当前连接的这个链的id
getChainId
我们在网页中编写代码如下

web3.eth.getChainId().then(res =>{
  console.log(res);
})

在这里插入图片描述
这里 就成功将我们的 链id就输出出来了

这里 我们也很确定了 确实是 网页已经连接到了我们本地的区块链

那么 下面我们就来做点有意义的事吧
通过账号 获取用户的ETH数量

你们要自己找方法 可以用文档https://learnblockchain.cn/docs/web3.js/web3-eth.html#getchainid
上面都会有函数演示和说明 但是他这个文档老实说结构做点不是特别清晰 需要耐心去找
在这里插入图片描述
这里 文档跟我们说 需要一个地址 简单说 就是需要账号的公钥
在这里插入图片描述
我们可以这样编写代码

web3.eth.getBalance("0xCA9368CbD09A84457a39E0909Ce9335D15Be81C6").then(res =>{
     console.log(res);
})

0xCA9368CbD09A84457a39E0909Ce9335D15Be81C是我ganache中十个账号中的一个的公钥 这里 你们肯定要自己去 启动的 ganache 环境中去拿一个账号来用
在这里插入图片描述
但是 这东西一输出 我估计大家都麻了 这明显就有问题啊
在这里插入图片描述
其实这个 展示的也没问题 只是一个单位没有转换处理
我不知道 大家对文件单位的转换敏不敏感 这个就差不多 就好比 我们 1024 转 M这个概念是一样的
这里 我们接口返回的单位也是最小的 叫 wei
在这里插入图片描述
其实这个我们直接 除就可以了 但是 我们还是搞正规一点 它有专门的方法

但是先说个题外话 这六个单位 其实你们可以拿名字去查一下 很有纪念意义 他们都是在数学和密码学上很有贡献的人
这个东西的作者还是有心了的
这边很多平台和文档都会说 希望在做计算是 还是 以wei这个单位来处理 只是涉及到展示时才要将他转换成 ether给用户看 方便用户统计处理

我们将代码改成

web3.eth.getBalance("0xCA9368CbD09A84457a39E0909Ce9335D15Be81C6").then(res =>{
  console.log(web3.utils.fromWei(res,"ether"));
})

utils.fromWei 两个参数 第一个 要转换的单位 第二个 要转换成什么点位
运行结果如下
在这里插入图片描述
这样 我们的单位就是之前看到的 1000了

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/681075.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【深度学习】【分布式训练】DeepSpeed:AllReduce与ZeRO-DP

AllReduce与ZeRO-DP ​ ZeRO-DP是分布式训练工具DeepSpeed的核心功能之一&#xff0c;许多其他的分布式训练工具也会集成该方法。本文从AllReduce开始&#xff0c;随后介绍大模型训练时的主要瓶颈----显存的占用情况。在介绍完成标准数据并行(DP)后&#xff0c;结合前三部分的内…

玩游戏提示d3dx9丢失-找不到d3dx9怎么修复

相信有些朋友遇到了d3dx9丢失的情况不知道怎么解决&#xff0c;而今日小编带来的这篇文章就是讲解关于d3dx9丢失进行修复的操作内容&#xff0c;d3dx9丢失怎么解决&#xff1f;&#xff08;修复方法&#xff09;d3dx9文件是DirectX中必备文件,许多游戏需要此文件运行。 d3dx9丢…

文件系统概述

目录 概述用户空间层面1.应用程序可以直接使用内核提供的系统调用访问文件&#xff1a;2.应用程序也可以使用 glibc 库封装的标准 I/O 流函数访问文件&#xff1a; 硬件层面1.块设备2.闪存3.NVDIMM 内核空间层面 概述 在 Linux 系统中&#xff0c;一切皆文件&#xff0c;除了通…

【MySQL 】:测试数据准备、SQL语句规范与基本操作

前言 欢迎来到小K的MySQL专栏&#xff0c;本节将为大家准备MySQL测试数据、以及带来SQL语句规范、数据库的基本操作的详细讲解~✨文末送书&#xff0c;小K赠书活动第二期 目录 前言一、准备测试数据二、SQL语句规范三、数据库的基本操作四、总结&#xff1a;文末赠书 一、准备测…

直线导轨在焊接领域有什么作用?

焊接技术在现代制造业中的应用越来越广泛&#xff0c;直线导轨作为重要的传动元件&#xff0c;已经成为焊接设备中不可或缺的部分。 相对于直线轴承来说&#xff0c;直线导轨具有较高的负载能力和刚度&#xff0c;能够保证高精度的直线运动&#xff0c;滑动摩擦小&#xff0c;惯…

【Python】异常处理 ③ ( 捕获所有类型的异常 | 默认捕获所有类型异常 | 捕获 Exception 异常 )

文章目录 一、Python 默认捕获所有类型异常1、默认捕获所有类型异常 - 无法获取异常类型2、代码实例 - 默认捕获所有类型异常 二、Python 捕获所有类型异常 - 捕获 Exception 异常1、捕获 Exception 类型异常 - 可获取异常类型2、代码实例 - 捕获 Exception 异常 一、Python 默…

管理类联考——逻辑——知识篇——形式逻辑——三、直言——haimian

直言 考点分析 直言 年度 2012 2013 2014 2015 2016 2017 2018 2019 2020 2021 2022 2023题量786223232 性质定义 直言命题也叫做性质命题&#xff0c;是判断事物是否具有某种性质的命题。直言命题由四部分组成&#xff1a;主项、谓项、联项、量项。 不同种类 对当关系 对…

PID控制算法:2、Derivative Kick(微分冲击)

什么是微分冲击Derivative Kick 引入微分&#xff0c;就是为了减少超调量的&#xff0c;但是根据PID的经典公式 就看微分部分 在PID刚开始时&#xff0c;误差值肯定是存在的&#xff0c;但是PID启动的瞬间&#xff0c;这个dt是很小的&#xff0c;这就导致是一个很大的值&#…

软件开发实习个人总结

软件开发实习个人总结篇1 一、实习目的 随着时代发展和社会进步&#xff0c;用人单位对游戏软件专业大学生的要求越来越高&#xff0c;对于即将毕业的游戏软件专业在校生而言&#xff0c;为了能更好的适应游戏软件专业严峻的就业形势&#xff0c;毕业后能够尽快的融入到社会&am…

Golang学习日志 ━━ 通过将gin-vue-admin项目上传到自己的仓库并且与原版保持更新来学习github操作

gin-vue-admin是一套国人用golang开发的后台管理系统&#xff0c;本文是从作者早期原文中截取的一部分&#xff0c;后期会以本文为框架进行扩展说明。 官网&#xff1a;https://www.gin-vue-admin.com/ 学习视频&#xff1a;https://www.bilibili.com/video/BV1kv4y1g7nT/?p6 …

Redis 2023面试5题(七)

一、Redis redlock 实现原理 Redlock是一种基于Redis的分布式锁实现&#xff0c;它可以解决在分布式系统中由于主从切换、网络延迟等导致的锁竞争问题。 Redlock的实现原理如下&#xff1a; 创建多个Redis实例&#xff0c;每个实例都有相同的锁名称。使用Redis的SETNX命令尝试…

如何选择消息中间件

一、 分布式系统消息通信技术简介 分布式系统消息通信技术主要包括以下几种&#xff1a; 1. RPC(Remote Procedure Call Protocol). 一般是C/S方式&#xff0c;同步的&#xff0c;跨语言跨平台&#xff0c;面向过程 2. CORBA(Common Object Request Broker Architecture). CO…

Vlan与ARP讲解

目录 Vlan讲解 Vlan标签 二层接口类型 ARP ARP的作用 ARP地址解析报文讲解 免费ARP报文讲解 ARP缓存表 Vlan讲解 Vlan&#xff08;Virtual Local Area Network&#xff09;虚拟局域网&#xff0c;将一个物理的LAN在逻辑上划分为多个广播域&#xff1b;可以理解为一个V…

RT-Thread-11-事件集

事件集 举例说明事件集&#xff1a; 1、A坐公交车去某地&#xff0c;只有一趟公交车去该地&#xff0c;等此公交车即可出发&#xff1b; 2、A坐公交车去某地&#xff0c;有三趟公交车去该地&#xff0c;等其中任意一辆公交车即可出发&#xff1b; 3、A约B一起去某地&#xff0…

点亮你的创意,使用Python与树莓派制作呼吸灯的详细教程

文章目录 前言PWM的介绍实现PWM控制LED亮度结果与分析 前言 在上一篇文章中&#xff0c;我们介绍了如何在树莓派上点亮一个LED灯&#xff0c;并让它以时间间隔为1秒进行闪烁。闪亮登场&#xff01;在树莓派上点亮LED灯的简单详细方法_☞黑心萝卜三条杠☜的博客-CSDN博客。现在&…

【剑指offer刷题记录 java版】数组双指针 之 其它题目

本系列文章记录labuladong的算法小抄中剑指offer题目 【剑指offer刷题记录 java版】数组双指针 之 其它题目 剑指 Offer II 018. 有效的回⽂剑指 Offer 58 - I. 翻转单词顺序剑指 Offer 21. 调整数组顺序使奇数位于偶数前⾯剑指 Offer 57. 和为s的两个数字剑指 Offer II 007. 数…

【裸机开发】IRQ 中断服务函数(三)—— 中断处理逻辑实现

实现了 IRQ 中断服务函数的汇编部分以后&#xff0c;接下来我们要使用C代码实现IRQ中断服务函数的具体逻辑&#xff0c;主要包含初始化和中断处理两部分。 全局中断初始化&#xff08;全局中断使能、IRQ中断使能&#xff09;具体中断处理逻辑实现 我们这里的中断是由按键产生…

springboot+mybatisplus复习笔记

1.环境搭建 依赖配置 <dependencies><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter</artifactId></dependency><dependency><groupId>com.mysql</groupId><artifa…

【Twitter爬虫】Twitter网络爬虫

利用selenium爬取Twitter 从2月9日起&#xff0c;Twitter不再支持免费访问Twitter API&#xff0c;继续使用Twitter API支付较高的费用。下面将介绍一种绕过Twitter API爬取推文的方式 Selenium Webdriver框架 首先介绍一下Selenium Webdriver&#xff0c;这是一款web自动化…