Web3与智能合约交互实战
链客，专为开发者而生，有问必答！
此文章来自区块链技术社区，未经允许拒绝转载。
Web3与智能合约交互实战
以太坊中智能合约和web3交互实战
最近区块链、以太坊十分的火，所有就会有许多人去进入区块链这个工作，也有许多人去学习。所以在开端学习以太坊的时分，许多人都是自己创建以太坊节点后，运用geth交互。但是不能盼望普通用户经过指令运用dapp。因此我们需求一种友爱的方法来与智能合约交互，那么这种问题的答案便是web3.js。
Web3.js
Web3.js是以太坊官方的API，可以帮忙智能合约开发者运用HTTP或许IPC与本地、长途的以太坊节点交互。实践就一个库的调集。当然了也包括几个库，比如：
web3-eth用来与以太坊区块链和智能合约交互
web3-shh用来控制whisper协议与p2p通讯以及播送
web3-bzz用来与swarm协议交互
web3-utils包括了一些Dapp开发有用的功用
Web3与geth通讯运用的是 JSON-RPC ，这是一种轻量级的RPC协议，整个通讯的模型可以抽象为下图。
树立检验链
在开发的初期的时分，我们并不用用实在的公链，为了开发的效率，一般都是用本地树立检验链。在这儿我们就挑选用Ganache，一个图形化检验软件，可以一键在本地树立以太坊区块检验环境，且用区块链的状态显现出来。
从图中可以看到Ganache会默许创建10个账户，监听地址是http://127.0.0.1:7545，可以实时看到Current Block、Gas Price、Gas Limit等信息。
创建智能合约
现在以太坊官方全力支持的智能合约开发环境是Remix IDE，我们在合约修正页面编写如下代码：
pragma solidity ^0.4.21;
contract InfoContract {
string fName;
uint age;
function setInfo(string _fName, uint _age) public {
fName = _fName;age = _age;
}
function getInfo() public constant returns (string, uint) {
return (fName, age);
}
}
代码很简略，便是简略的给name和age变量赋值与读取，接下来切换到 run 的 tab 下，将Environment切换成Web3 Provider，并输入我们的检验链的地址http://127.0.0.1:7545，这儿对这三个选项做一简略说明：
Javascript VM：简略的Javascript虚拟机环境，朴实练习智能合约编写的时分可以挑选
Injected Web3：衔接到嵌入到页面的Web3，比如衔接到MetaMask
Web3 Provider：衔接到自定义的节点，如私有的检验网络。
假设衔接成功，那么在下面的Account的选项会默许挑选 Ganache 创建的第一个账户地址。接下来我们点击Create就会将我们的智能合约布置到我们的检验网中。接下来 Remix 的页面不要封闭，在后面编写前端代码时还要用到合约的地址以及ABI信息。
装置Web3
在这之前，先在终端创建我们的项目：
mkdir info
cd info
接下来运用 node.js 的包管理工具 npm 初始化项目，创建package.json 文件，其间保存了项目需求的相关依赖环境。
npm init
一路按回车直到项目创建结束。终究，运转下面指令装置web.js：
npm install web3
创建 UI
在项目目录下创建index.html，在这儿我们将创建基础的 UI，功用包括name和age的输入框，以及一个按钮，这些将经过 jQuery 结束：
Document
Info Contract
NameAgeUpdate Info
接下来需求编写main.css文件设定根本的款式：
body {
background-color:#F0F0F0;padding: 2em;font-family: 'Raleway','Source Sans Pro', 'Arial';
}
.container {
width: 50%;margin: 0 auto;
}
label {
display:block;margin-bottom:10px;
}
input {
padding:10px;width: 50%;margin-bottom: 1em;
}
button {
margin: 2em 0;padding: 1em 4em;display:block;
}
#info {
padding:1em;background-color:#fff;margin: 1em 0;
}
##运用Web3与智能合约交互
UI 创建好之后，在
这段代码是web3.js Github供应的样例，意思是假设web3现已被定义，那么就可以直接当作我们的 provider 运用。假设没有定义，则我们手动指定 provider。
在上面代码的基础上，接下来设置默许的以太坊账户：
web3.eth.defaultAccount = web3.eth.accounts[0];
在上文中我们运用 Ganache 现已创建了 10 个账户了，这儿我们挑选第一个账户当作默许账户。
接下来需求让我们的web3知道我们的合约是什么样的，这儿需求用到合约的 ABI（Application Binary Interface）。ABI可以使我们调用合约的函数，而且从合约中获取数据。
在上文中我们现已在 Remix 中创建了我们的合约，这时重新回到 Remix，在 Compile 的 tab 下我们点击Details 呈现的页面中我们可以拷贝合约的ABI，如下图所示。
将其复制到代码中：
var infoContract = web3.eth.contract(PASTE ABI HERE!);
接下来转到 run 的tab，拷贝合约的地址，将其复制到下面的代码中：
var info = InfoContract.at(‘PASTE CONTRACT ADDRESS HERE’);
结束这些我们就可以调用合约中的函数了，下面我们运用 jQuery 与我们的合约进行交互：
info.getInfo(function(error, result){
if(!error){$("#info").html(result[0]+' ('+result[1]+' years old)');console.log(result);}elseconsole.error(error);
});
$("#button").click(function() {
info.setInfo($("#name").val(), $("#age").val());
});
以上的代码就简略地结束了对合约中两个函数的调用，别离读取和显现name和age变量。
到此我们就结束了悉数的代码，完好代码可以在 InfoContract 中找到。在浏览器中翻开index.html检验效果如下图（输入名字和年龄后改写）。
毕竟也说了，最近区块链以太坊都很火，也就会有许多衍生的使用，需求我们去多学习学习笔记那个跟上节奏嘛。今日就讲到这儿，因此我们需求一种友爱的方法来与智能合约交互，那么这种问题的答案便是web3.js。所以可以仔细仔细看一看，期望对我们有些帮忙。
相关文章：
BZOJ 4595 SHOI2015 激光发生器 射线，线段，偏转
题目链接：http://www.lydsy.com/JudgeOnline/problem.php?id4595 题意概述： 给出一条射线和N条线段，射线遇到线段会发生反射，令入射角alpha，出射角beta，则betaalpha*phi_i（即对于每条线段phi是…
实现一个 能在O(1)时间复杂度 完成 Push、Pop、Min操作的 栈
一，问题描述 实现一个栈（元素遵守先入后出顺序），能够通过 min 方法在 O(1)时间内获取栈中的最小元素。同时，栈的基本操作：入栈(Push)、出栈(Pop)，也是在O(1)时间内完成的。 二，问题分…
华为js面试题_四面腾讯与华为，大厂前端面试真BT！
今年算是经历颇多的一年了，腾讯和华为都走了几趟（一共面试了四个部门），拿了两个offer。（开心.png），但还是挂了两次，有点遗憾。面试题总结面试完之后，赶紧总结了一波&…
你和区块链的距离就差这篇文章！
链客，专为开发者而生，有问必答！ 此文章来自区块链技术社区，未经允许拒绝转载。 近年来，“区块链”逐渐成为热门话题，2018年各种关于区块链的行业资讯、投融资创业、技术和应用探索等集中爆发，…
Browser Security-超文本标记语言（HTML）
重要的4个规则： 1 &符号不应该出现在HTML的大部分节点中。 2 尖括号<>是不应该出现在标签内的，除非为引号引用。 3 在text节点里面，<左尖括号有很大的危害。 4 引号在标签内可能有危害，具体危害取决于存在的位置&…
NestedScrolling CoordinatorLayout
Android NestedScrolling机制完全解析 带你玩转嵌套滑动 一步一步深入理解CoordinatorLayout 源码看CoordinatorLayout.Behavior原理 转载于:https://www.cnblogs.com/cornellbox/p/8649891.html
python下载电脑版本不对_初学Python，因为某些原因电脑只能装3.1版本，现遇到这个小问题求解答...
#!/usr/bin/env python # -*- coding: utf-8 -*-任务: 假设用户输入的英文名字不规范，没有按照首字母大写，后续字母小写的规则， 请利用map()函数，把一个list（包含若干不规范的英文名字）变成一个包含规范英文…
以太坊是什么？
链客，专为开发者而生，有问必答！ 此文章来自区块链技术社区，未经允许拒绝转载。 以太坊是一个全新开放的区块链平台，它允许任何人在平台中建立和使用通过区块链技术运行的去中心化应用。就像比特币一样，以…
前端相关html和css
#请参考http://www.cnblogs.com/pycode/p/5792142.html #html css 和js说明 ##1.什么是html？ HTML(HyperText MarkUp Language)超文本标记语言,通过使用标记来描述文档结构和表现形式的一种语言,由浏览器进行解析,然后把结果显示在网页上，通俗的讲它就是…
编写五子棋的完整python代码_python制作简单五子棋游戏
本文实例为大家分享了python五子棋游戏的具体代码，供大家参考，具体内容如下 #五子棋 ‘” 矩阵做棋盘 16*16 “” 打印棋盘 for for 游戏是否结束 开始下棋 while 游戏是否结束： 黑白交替 player0 p%20 1 p1 下棋动作一样 但是棋子不一样 ‘”…
新建JRapid项目（idea创建maven多模块项目）
1、第一步，新建项目（Create New Project） 2、parent项目，不勾选“Crate from archetype”，直接单击“Next”。 3、groupid填写com.codingwhy，ArtifactId填写JRapid。 4、Project name 填写 JRapidÿ…
这个美国议员候选人想发币，联邦选举委员会还答应了
链客，专为开发者而生，有问必答！ 此文章来自区块链技术社区，未经允许拒绝转载。 佛罗里达州的一名国会候选人想给竞选志愿者发放基于以太坊的代币，以激励他们的工作，这是一项实验性的举措，而联邦…
day8 函数
写代码先画流程图 复习： 什么是文件？ 文件操作 read（） with open（）as f: 取代close（） 文件的打开模式 t:text文本模式 只能操作文本 b:bytes字节模式 视频音频图片，也…
SQL Server中的分页查询
分页查询很简单，具体代码如下： --分页查询--查询1-3行数据 select top 3 * from emp order by sal desc;--查询4-6行数据 select top 3 *from empwhere empno not in (select top 3 empno from emp order by sal desc)order by sal desc;--查询7-9行数据…
python数据库建表_mysql数据表如何创建
在 MySQL 中，可以使用 CREATE TABLE 语句创建表。其语法格式为：CREATE TABLE <表名> ([表定义选项])[表选项][分区选项]; 其中，[表定义选项]的格式为：<列名1> <类型1> [,…] <列名n> <类型n> CREAT…
行情分析：下杀或不可持续，市场大概率继续震荡
链客，专为开发者而生，有问必答！ 此文章来自区块链技术社区，未经允许拒绝转载。 美联储主席杰罗姆鲍威尔周三在众议院金融服务委员会的听证会上表示，在Facebook详细说明如何处理一系列监管问题之前，不应允许…
水平，垂直居中的15种方法
一.水平居中 1.文字水平居中 <div class"one">测试居中</div><style>.one{width: 200px;height: 100px;border:1px solid red;text-align: center;}</style>2.盒子居中 <div class"one">是盒子居中</div><style>…
Hadoop葵花宝典（一）
1. 描述如何安装配置Hadoop 参考：http://www.cnblogs.com/xia520pi/archive/2012/04/08/2437875.html 安装Linux(虚拟机上)—CentOS：创建用户，关闭防火墙，PS：不关防火墙无法访问Web管理页面，删除和增加节点…
stata命令汇总_第九届高级计量经济学及stata应用研讨会在京顺利举办
二零一九，寒假佳时，近30余所高校的师生齐聚北京，参加了计量经济学服务中心举办的第九届“高级计量经济学及Stata应用”现场研讨班。本届研讨班于2019年1月19日-1月22日在北京国际温泉酒店顺利举办，现场学员既有博士、硕士…
下轮牛市高峰可能在2020年，以太坊是关键
链客，专为开发者而生，有问必答！ 此文章来自区块链技术社区，未经允许拒绝转载。 “用自己一颗宁静的内心去感受市场真正的趋势，一旦发现趋势便全力跟随之。—刘强《期货大作手风云录》” 文章导读： 驱动这…
jQuery中的事件机制深入浅出
昨天呢,我们大家一起分享了jQuery中的样式选择器,那么今天我们就来看一下jQuery中的事件机制,其实,jQuery中的事件机制与JavaScript中的事件机制区别是不大的,只是,JavaScript中调用是原生的函数方法,而jQuery中调用的绑定的是jQuery中的对象方法,那么在昨天的第一篇中,我们已经…
滑动加载商品列表
商品列表htmL 所绑定的js事件 后台代码 $(function () { //滚动加载 var stop true; var start 2; // $.ajaxSetup({async:false}); function getData(url){ // console.log(url); $.ajax({ type:"get",//跨域访问时只能用get url:url,//要访问的api地址 dataType:…
mac 怎么查找大于200m的文件_U盘无法拷贝大于4GB的文件怎么办？
相信在经常使用U盘的用户手中，都会或多或少的存有几个U盘，有时候如果我们需要重装系统的时候，就会发现下载的系统居然无法拷贝到U盘当中，这究竟是怎么回事呢？U盘主要有三种格式：FAT32：缺点&…
以太坊今日大涨7.5%，芝商所备战“以太坊期货”
链客，专为开发者而生，有问必答！ 此文章来自区块链技术社区，未经允许拒绝转载。 据The Block报道，芝加哥商品交易所（CME）预计将于7月15日改变以太坊相关的参考利率和指数，消息人士称…
python package_Python之package、module
一、模块： 1.简单的描述：一个.py文件 2.好处：大大提高代码的可维护性 3.模块三种：1.python标准库 2.第三方模块 3.应用程序自定义模块（*****） 4.import实质就是：1.执行对应文件 2.引入变量名 在…
C# Timer使用方法示例
实例化一个timer： // 每5分钟执行一次,每次执行的间隔毫秒时长 System.Timers.Timer timer new System.Timers.Timer(5*60*1000);为timer设置事件和任务循环回调方法： //到达时间的时候执行事件timer.Elapsed new System.Timers.ElapsedEventHandler(T…
[Educational Codeforces Round 16]A. King Moves
[Educational Codeforces Round 16]A. King Moves 试题描述 The only king stands on the standard chess board. You are given his position in format "cd", where c is the column from a to h and dis the row from 1 to 8. Find the number of moves permitted…
解读Go语言的2018：怎么就在中国火成这样了？
链客，专为开发者而生，有问必答！ 此文章来自区块链技术社区，未经允许拒绝转载。 本篇文章是 Go 语言 2018 年终盘点，力求客观、深入分析 2018 年 Go 语言的技术发展现状，同时对明年可能的发展情况进行预测…
Io流的字节流与缓冲流
当我们队大量数据进行保存时可以用数组，当数据到达一定量时或给用户一个易懂得接口时就可采用IO流： IO流按进行的操作分输出流与输入流InputStream与OutputSteam 按操作的原理来分有2种常见的IO流字节流与缓冲流：这2种IO的的输入输出流都是对…
057 Insert Interval 插入区间
给出一个无重叠的按照区间起始端点排序的区间列表。在列表中插入一个新的区间，你要确保列表中的区间仍然有序且不重叠（如果有必要的话，可以合并区间）。示例 1:给定区间 [1,3],[6,9]，插入并合并 [2,5] 得到 [1,5],[6,9]…