前端在区块链中扮演的角色
本文讨论一下前端在区块链中起什么作用,我觉得前端主要还是扮演的交互角色,在web端、在移动端,调用库和接口对区块链上的数据进行操作,那么具体是调用哪些库呢?
Wagmi、Viem 和 Web3Modal 是在 Web3 开发中常用的工具库,主要用于构建与区块链交互的前端应用。它们分别解决了区块链交互、RPC 通信、和钱包连接的不同问题,但可以组合起来构建更强大、用户体验更好的 DApp。
1. WagmiWagmi 是一个用于 React 应用的前端库,简化了与以太坊和其他 EVM 兼容区块链的交互。它提供了一套 React hooks,使得钱包连接、账户信息获取、区块链读写操作等功能变得非常方便。Wagmi 的核心设计理念是“易用”和“高可定制性”,并且支持与多种钱包和 RPC 库的无缝集成。
主要特点:
React hooks 简化区块链交互
内置状态管理和错误处理
与多种钱包无缝集成
支持合约读写、监听事件等
2. ViemViem 是一个现代化的以太坊 JavaScript 库,用于与区块链节点(如 RPC 节点)进行通信。它可以被视为 ethers.js 的替代品,提供了 ...
ETH交易详情解析
Transaction Hash: 一个独一无二的交易哈希,代表该区块链上的该笔交易
Status: 交易的状态 Success 或者 Fail
Block: 被确认的区块高度(区块链的一种“长度”或“深度”)
16896 Block Confirmations: 意味着在交易所在的那个区块之后,已经有16个新的区块被添加到区块链中。确认次数越多,交易被篡改或回滚的可能性就越低。
Timestamp: 交易发生的时间
From: 发送方
To: 接收方
Value: 发送了多少ETH
Transaction Fee: 本次交易所花费的手续费 (Base fee per gas + Max Priority fee per gas)* gas
Gas Price: Gas的费用
Gas Limit & Usage by Txn: 限制使用多少Gas(愿意为这次交易付出的最大Gas) 和 实际使用了的Gas
Gas Fees
Base:网络为每个区块动态调整的最低费用,用于确保交易在区块链上的处理。它由网络自动设定,随着网络拥堵程度的变化而变化。Ba ...
ETH交易详情解析
Transaction Hash: 一个独一无二的交易哈希,代表该区块链上的该笔交易
Status: 交易的状态 Success 或者 Fail
Block: 被确认的区块高度(区块链的一种“长度”或“深度”)
16896 Block Confirmations: 意味着在交易所在的那个区块之后,已经有16个新的区块被添加到区块链中。确认次数越多,交易被篡改或回滚的可能性就越低。
Timestamp: 交易发生的时间
From: 发送方
To: 接收方
Value: 发送了多少ETH
Transaction Fee: 本次交易所花费的手续费 (Base fee per gas + Max Priority fee per gas)* gas
Gas Price: Gas的费用
Gas Limit & Usage by Txn: 限制使用多少Gas(愿意为这次交易付出的最大Gas) 和 实际使用了的Gas
Gas Fees
Base:网络为每个区块动态调整的最低费用,用于确保交易在区块链上的处理。它由网络自动设定,随着网络拥堵程度的变化而变化。Ba ...
签名交易 Signature transaction
本文讨论一下签名交易,私钥和其他密码学知识。
Blockchain Demo (andersbrownworth.com)
什么如何确定图中区块1的交易信息中第一条,Darcy真的给Bingley发了25元呢?也就是怎么知道这个交易真的发生了呢?
我们需要了解私钥和公钥 & 他们是怎么验证的
示例网站
Blockchain Demo: Public / Private Keys & Signing (andersbrownworth.com)
上图中,私钥会通过ECDSA算法,比特币和以太坊都使用这个算法,它是DSA(电子签名算法)的一种,它可以根据私钥创建出公钥,想了解DSA算法可以b站看技术蛋老师的ecc算法。
在交易中,我会像密码一样使用私钥,对交易进行电子签名,然后别人可以通过公钥来验证这个签名的交易。
让我们演示一下,接下来到Blockchain Demo: Public / Private Keys & Signing (andersbrownworth.com)页面,进行签名和验证的操作。
message是你想要对其签名的 ...
区块链的运作机制
哈希算法的概念了解运作机制之前要先了解哈希算法
哈希算法它是一种单向密码体制,即它是一个从明文到密文的不可逆的映射,只有加密过程,没有解密过程。一般把哈希算法得出来的结果称为哈希Hash
哈希Hash是一个独一无二的固定长度字符串,用来代表一段数据,它通过将一个数据传入”哈希函数”来生成。生成哈希的函数有很多种,比如常见的SHA256,以太坊使用的是Keccak256算法
区块的矿工的作用区块的示例网站:Blockchain Demo (andersbrownworth.com)
在区块中我们把数据分块
Block 区块
Nonce 随机数
Data 数据:在实际BTC系统里,Data域就是body,里面有交易树结构
我们会把这3部分都进行哈希运算,得到哈希值。
而“矿工”的工作其实是解题,一道填空题,挖矿的时候,矿工会收到一道题目,图中的区块和数据是固定的而哈希是目标,随机数是答案。因为哈希是单向的,你只能通过穷举去穷举随机数Nonce的值,穷举到了这个随机数,也就是72608后,发现哈希值与目标哈希一致,那么这道题就解出来了,答案是72608。
这就是矿工的作用,不断计算找到 ...
微信小程序scroll-view的scroll-into-view定位在安卓和模拟器中正常在ios中定位错误乱跳
需求是一进入页面就要执行scroll让页面滚动到对应位置。
原因是元素未渲染完成获取不到id导致定位错误
解决办法是:设置延迟时间等待元素加载完就可以了
发起区块链第一笔交易
创建钱包
下载MetaMask:Download MetaMask
安装MetaMask浏览器插件
然后根据提示创建一个新的钱包
可以复制账户地址到区块浏览器查看账户细节:https://etherscan.io/
同一个助记词下可以有多个账户
账号地址是我们公开的身份
每个账号地址有私钥,不能分享和暴露私钥,私钥可以进入私钥对应的账户
使用测试网络进行操作
获取测试币
通过测试网水龙头获取测试币:Testnet Faucets
设置跟钱包一样的测试网络然后点击Connect wallet链接钱包
然后选择你的测试钱包并确定
然后在下方选择一个测试网络Ethereum Sepolia描述drips 0.1 ETH的水龙头,通过验证后获取tokens
然后就可以在MetaMask查看到你有0.1 SepoliaETH
查看具体的交易详情
在MetaMask点击这次交易
点击【收款】
点击状态的【在区块浏览器上查看】
可以看到这次交易的详情
关于Gas Price和Transaction Fee的概念不同的节点运行区块链,是因为他们可以通过区块链 ...
智能合约的作用
前言再讲智能合约前,我们先看看一个传统合约,或者说传统的合同的例子。
银行收取你的钱,他承诺你你的钱非常安全,什么时候都能取出来不会被他吞掉。
在这个例子中,其实本质是一个信任问题,你作为客体要相信银行这个主体信守承诺,真的不会吞掉你的钱,但是历史告诉我们,本该被信任的主题却常常不信守承诺,卷款跑路,导致付出信任的客体遭受大量损失。
你可能会说这些信任系统会有很多保障,比如法院,财务受损后可以去法院申诉等,但这需要非常多的精力和时间然后才能有一个解决方案(并且大部分时候并不是让人满意的)。
所以有没有一项技术能够从根本上解决当今合同不履行问题,这个技术就是智能合约,智能合约就是区块链被开发出来的目的。
什么是智能合约智能合约是部署在去中心化区块链上的一个合约或者一组指令
An agreement, contract, or set of instructions that is deployed on a decentralized blockchain
智能合约有以下特点:
一被部署就无法修改 ( Cannot be altered(immutable) )
部署后自动执行( ...
区块链基础知识
什么是区块链比特币 Bitcoin (BTC):以密码学算法为基础,能够让人们以去中心化的方式,发生非许可的金融行为。
以太坊 Ethereum (ETH):除了去中心化的交易,还可以签署去中心化的合同,构建去中心化的组织,以及在不需要中心化中介的情况下,以去中心化的方式进行协作。
实际上以太坊的想法是使用比特币中的技术,再加上去中心化的合同,或者叫智能合约(Smart Contract),区块链或者说是以太坊实现了智能合约的概念。
关于智能合约:
智能合约是通过去中心化的方式来执行一些列的指令,在这些指令执行中,并不需要中心化或者第三方的中介。
Smart Contracts are a set of instructions executed in a decentralized way without the need for a centralized or third parth intermediary.
可以把智能合约当成是传统的契约或者合同,不同的是,传统的合同通过笔写在纸上,或者通过word把内容输入进去,而智能合约是代码写的,并且嵌入到一个去中心化的区块链平台。 ...
windows选项影响scrollIntoView的smooth动画效果,scrollIntoView的smooth无效/失效
问题:项目中scrollIntoView设置了smooth平滑过渡失效。
解决:是因为调整的windows性能选项导致的。
如图所示:打开【控制面板】- 搜索【性能】 - 调整 Windows 的外观和性能选项 - 开启【窗口内的动画控件和元素】。
设置完后点击应用或者确定,恢复平滑过渡效果。