【智能合约】客户端和web端对智能合约的事件Event进行调用的代码示例

简介: 客户端和web端对智能合约的事件Event进行调用的代码示例web truffle按官网的例子 http://truffleframework.com/boxes/pet-shoptruffle作为一个运行测试框架,用的也是web3对智能合约进行调用。

客户端和web端对智能合约的事件Event进行调用的代码示例

web truffle

按官网的例子

http://truffleframework.com/boxes/pet-shop

truffle作为一个运行测试框架,用的也是web3对智能合约进行调用。

文件所在的位置src/js/app.js


  initWeb3: function() {

      // web3入口
      if (typeof web3 !== 'undefined') {
          App.web3Provider = web3.currentProvider;
      } else {
          // 测试网络
          App.web3Provider = new Web3.providers.HttpProvider('http://localhost:8588'); //这里是我指定的端口88
      }
      web3 = new Web3(App.web3Provider);

    return App.initContract();
  },

初始化智能合约的时候,用了truffle自己编译的json文件进行调用

  initContract: function() {
      //加载Adoption.json
      $.getJSON('Adoption.json', function(data) {
          // 智能合约实例化
          var AdoptionArtifact = data;
          App.contracts.Adoption = TruffleContract(AdoptionArtifact); //赋值到App.contracts下的节点数据

          // 设置合约提供者
          App.contracts.Adoption.setProvider(App.web3Provider);

          // 检索操作
          return App.markAdopted();
      });

    return App.bindEvents();//执行事件绑定
  },

事件绑定是这么实现的

  bindEvents: function() {
    $(document).on('click', '.btn-adopt', App.handleAdopt);
  },

其中btn-adopt对应的是src/index.html中的按钮

 <button class="btn btn-default btn-adopt" type="button" data-id="0">Adopt</button>

运行环境后,进行元素检查,发现按钮绑定了事件

这里写图片描述

被绑定的方法在js文件的下面做定义。

  handleAdopt: function() {
    event.preventDefault();//该方法将通知 Web 浏览器不要执行与事件关联的默认动作(如果存在这样的动作)

    var petId = parseInt($(event.target).data('id'));

      var adoptionInstance;

      web3.eth.getAccounts(function(error, accounts) { //本质还是web3调用
          if (error) {
              console.log(error);
          }

          var account = accounts[0];

          App.contracts.Adoption.deployed().then(function(instance) {
              adoptionInstance = instance;

              // Execute adopt as a transaction by sending account
              return adoptionInstance.adopt(petId, {from: account});
          }).then(function(result) {
              return App.markAdopted(); //成功了就把按钮禁用
          }).catch(function(err) {
              console.log(err.message);
          });
      });
  }

  markAdopted: function(adopters, account) {
      //实例
      var adoptionInstance;


      App.contracts.Adoption.deployed().then(function(instance) {
          adoptionInstance = instance;

          return adoptionInstance.getAdopters.call();
      }).then(function(adopters) {
          for (i = 0; i < adopters.length; i++) {
              if (adopters[i] !== '0x0000000000000000000000000000000000000000') {
                  $('.panel-pet').eq(i).find('button').text('Success').attr('disabled', true);
              }
          }
      }).catch(function(err) {
          console.log(err.message);
      });
  },

总结:web端的智能合约使用技术栈为 Node + truffle + web3 ,能完成完整的编写,测试,部署。

客户端 java web3j

项目开源地址为 https://github.com/web3j/web3j

由于web3j的作用和web3一样,都是对智能合约进行部署调用。

客户端 java qtum-android

量子链官方钱包客户端并没有使用web3j,而是自己写的库。

项目地址为 https://github.com/qtumproject/qtum-android

文件为位置 app/src/main/java/org/qtum/wallet/utils/ContractBuilder.java

目录
相关文章
|
7天前
|
监控 Linux PHP
【02】客户端服务端C语言-go语言-web端PHP语言整合内容发布-优雅草网络设备监控系统-2月12日优雅草简化Centos stream8安装zabbix7教程-本搭建教程非docker搭建教程-优雅草solution
【02】客户端服务端C语言-go语言-web端PHP语言整合内容发布-优雅草网络设备监控系统-2月12日优雅草简化Centos stream8安装zabbix7教程-本搭建教程非docker搭建教程-优雅草solution
57 20
|
12天前
|
监控 关系型数据库 MySQL
【01】客户端服务端C语言-go语言-web端PHP语言整合内容发布-优雅草网络设备监控系统-硬件设备实时监控系统运营版发布-本产品基于企业级开源项目Zabbix深度二开-分步骤实现预计10篇合集-自营版
【01】客户端服务端C语言-go语言-web端PHP语言整合内容发布-优雅草网络设备监控系统-硬件设备实时监控系统运营版发布-本产品基于企业级开源项目Zabbix深度二开-分步骤实现预计10篇合集-自营版
22 0
|
2月前
|
开发框架 .NET PHP
ASP.NET Web Pages - 添加 Razor 代码
ASP.NET Web Pages 使用 Razor 标记添加服务器端代码,支持 C# 和 Visual Basic。Razor 语法简洁易学,类似于 ASP 和 PHP。例如,在网页中加入 `@DateTime.Now` 可以实时显示当前时间。
|
4月前
|
计算机视觉 Python
Flask学习笔记(六):基于Flask的摄像头-web显示代码(可直接使用)
这篇文章是关于如何使用Flask框架结合OpenCV库,通过电脑摄像头实现视频流在网页上的实时显示,并提供了单摄像头和多摄像头的实现方法。
181 2
Flask学习笔记(六):基于Flask的摄像头-web显示代码(可直接使用)
|
4月前
|
机器学习/深度学习 移动开发 JavaScript
Web实时通信的学习之旅:SSE(Server-Sent Events)的技术详解及简单示例演示
Web实时通信的学习之旅:SSE(Server-Sent Events)的技术详解及简单示例演示
1362 0
|
4月前
|
网络协议 安全 JavaScript
Web实时通信的学习之旅:WebSocket入门指南及示例演示
Web实时通信的学习之旅:WebSocket入门指南及示例演示
434 0
|
5月前
|
XML JSON 安全
Web安全-代码注入
Web安全-代码注入
49 6
|
4月前
|
API C#
异步轮询 Web API 的实现与 C# 示例
异步轮询 Web API 的实现与 C# 示例
120 0
|
5月前
|
Web App开发 前端开发 JavaScript
Web前端项目的跨平台桌面客户端打包方案之——CEF框架
Chromium Embedded Framework (CEF) 是一个基于 Google Chromium 项目的开源 Web 浏览器控件,旨在为第三方应用提供嵌入式浏览器支持。CEF 隔离了底层 Chromium 和 Blink 的复杂性,提供了稳定的产品级 API。它支持 Windows、Linux 和 Mac 平台,不仅限于 C/C++ 接口,还支持多种语言。CEF 功能强大,性能优异,广泛应用于桌面端开发,如 QQ、微信、网易云音乐等。CEF 开源且采用 BSD 授权,商业友好,装机量已超 1 亿。此外,GitHub 项目 CefDetector 可帮助检测电脑中使用 CEF
747 3
|
JavaScript 前端开发 API
【Web API系列教程】3.6 — 实战:处理数据(创建JavaScript客户端)
在本节,你将使用HTML、JavaScript和Knockout.js库为应用程序创建客户端。我们将按如下步骤建立客户端应用: 1, 展示books列表 2, 展示book详细信息 3, 添加一本新书 Knockout.js库使用了模型-视图-视图模型(MVVM)模式: 1, 模型是在业务域(在本例中是books和authors)中数据在服务器端的表现形式。
1069 0

热门文章

最新文章

  • 1
    打造高效的Web Scraper:Python与Selenium的完美结合
    14
  • 2
    Burp Suite Professional 2025.2 (macOS, Linux, Windows) - Web 应用安全、测试和扫描
    32
  • 3
    AppSpider Pro 7.5.015 for Windows - Web 应用程序安全测试
    23
  • 4
    【02】客户端服务端C语言-go语言-web端PHP语言整合内容发布-优雅草网络设备监控系统-2月12日优雅草简化Centos stream8安装zabbix7教程-本搭建教程非docker搭建教程-优雅草solution
    57
  • 5
    部署使用 CHAT-NEXT-WEB 基于 Deepseek
    375
  • 6
    【2025优雅草开源计划进行中01】-针对web前端开发初学者使用-优雅草科技官网-纯静态页面html+css+JavaScript可直接下载使用-开源-首页为优雅草吴银满工程师原创-优雅草卓伊凡发布
    27
  • 7
    java spring 项目若依框架启动失败,启动不了服务提示端口8080占用escription: Web server failed to start. Port 8080 was already in use. Action: Identify and stop the process that’s listening on port 8080 or configure this application to listen on another port-优雅草卓伊凡解决方案
    42
  • 8
    零基础构建开源项目OpenIM桌面应用和pc web- Electron篇
    29
  • 9
    【01】客户端服务端C语言-go语言-web端PHP语言整合内容发布-优雅草网络设备监控系统-硬件设备实时监控系统运营版发布-本产品基于企业级开源项目Zabbix深度二开-分步骤实现预计10篇合集-自营版
    22
  • 10
    FastAPI与Selenium:打造高效的Web数据抓取服务 —— 采集Pixabay中的图片及相关信息
    57