缘起


小编趁着端午节假期,抽了点时间偷偷卷了下,为啥选择卷web3呢,其实有两个原因。原因一:抓住潮流的尾巴,感觉其他的前端可以卷的内容不多了。原因二:做点笔记,造福大家!

web3是啥


具体概念大家可以去网上查,小编的总结就是区块链相关,是不是很容易理解,现在很火的一些概念,元宇宙,某某币,nft盲盒等等,都离不开web3。其实,大部分情况下,web2都是适用的,大家除非是对区块链相关专题感兴趣,不然没必要深入web3。

web3如何使用


其实网上有很多相关的文档,大家感兴趣可以自行学习,小编在这小节大致说说如何使用。

已知的区块链平台就这么几个,大家可以网上搜索,为了培养大家的搜索积极性,所以小编就暂时把区块链平台称为A,主流货币称为a,a是一直与比特币等价值挂钩的硬币,大家可以简单理解成两个国家之间的货币,按照一定的比例转换。

平台有了,这个时候,如果某公司,我们称之为B,想开发一个项目,平台A会提供一套规范,这个时候B就可以按照规范,提交代码到A的平台,同时B也提供了可视化的界面,用于和A进行交互,那么用户就可以通过一些可视化的界面来增加或者减少在这个平台的货币a了。

是不是很通俗易懂,没有任何的专业术语,如果你是初学者,看到这里差不多了,了解下概念,觉得可以,记得点赞收藏打赏,哈哈哈。

结论:web3是一个连接各个区块链平台的技术规范,衍生出一些库方便操作,例如web3.js,通过操作。前端就是引入相关的库,按照web3提供的js,对区块链进行操作,就这么简单。

具体的场景


还是以上面的公司和区块链为例子,B公司这个时候想开发一个自己的货币,也就是我们常常说的代币,我们假设代币是b,那么这个时候B公司必须通过Solidity语言,在A的规范上,部署自己的代码,我们称为合约。合约部署完毕后,就是不可更改的,因为A可以简单看作是一个账户和交易平台,那么B公司自然希望用户可以参与交易。

这个时候B公司推出了一款产品,名叫nft盲盒,里面会开出来很多的贺卡,不同的贺卡价格不一样,类似抽奖。同时B公司规定,必须用A上的代币b才能购买,那么用户是不是必须先充值a这个主流货币,然后a兑换代币b,再用b购买盲盒。

这个时候,B公司又开发了一系列其他功能,比如盲盒开出的贺卡可以合成,也可以赠送,也可以在B公司的网站上进行交易,是不是完美的把区块链相关的流程串起来了。

所以说,区块链只是个交易平台和钱包,外加记录信息用的,不同的人可以通过不同的方式来加以应用。有兴趣的同学可以自己去试下开发一个测试的DApp。

注意点


小编总结了几点注意点

  • web3通过contract调用部署的合约,这里的合约指的是B公司用Solidity语言写的合约
  • web3本身也有一些api可以直接和区块链交互
  • 不同区块链上就是同一种代币,也是不互相关联的,可以看成是两个数据库的数据
  • 不同版本的web3方法可能不一样,就和node类似,文档有些又不全,需要类比和阅读源码,多次测试。

看看代码

const web3 = new Web3(web3js.currentProvider);
 const contract = web3.eth.contract().at(address);
return new Promise((resolve, reject) => {
    contract[method](address2, function (err, res) {
      if (!err) {
        resolve(res);
      } else {
        reject(err);
      }
    });
  });

上面的代码就是对第一和第二点完美的诠释,contract可以看成是web3与区块链A进行交互,从而获取合约的相关信息,即contract,对应上面的第二点。后面的new Promise对应上面的第一点,web3和B公司部署的合约交互,修改代币b的数量等。

address就是contract地址,也就是合约地址,address2是操作的地址,比如后面的method是支付操作pay,那么address2就是支付操作pay所在的合约地址,通过这一系列操作来进行交互。

尾声


美好的时光总是短暂的,读完此文的同学是不是又偷卷了其他童鞋,哈哈,我们下期再见!

声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。