四、DApp化

我们在第一节里创建的应用还不能成为DApp，现在我们需要将App和合约连接起来，才实现将App转型成DApp。

前面说过合约中定义的方法对应业务中的需求，所以，你一定知道在业务代码中什么位置调用合约中的什么方法。

在这里需要注意的是查询接口和交易接口调用的不同，查询接口调用可以不需要权限的认证，也不会消耗gas，而交易接口一定需要权限的认证并且会消耗一定量的gas。因为矿工挖矿需要报酬啊😄

查询接口调用

查询接口调用可以直接用neb库，也可以用官方提供的nebpay库来调用，nebpay是以交易的方式调用，需要验证钱包也会消耗NAS。

neb库引入

根据你的应用构建方式的不同，你可以选择直接在页面引入js库或者npm install模块。

页面直接引用

需要在github下载源码，然后打包生成nebulas.js。
neb.js源码
或者也可以直接从这里下载jsnebulas.js

<script type="text/javascript" src="nebulas.js"></script>

node模块化安装

npm install nebulas -D

页面调用nebulas库

初始化neb

var HttpRequest = nebulas.HttpRequest;
this.neb = new nebulas.Neb();
this.neb.setRequest(new HttpRequest($this.net_address));

调用api

      var $this = this;
      var value = "0";
      var nonce = this.nonce;
      this.nonce = this.nonce+1;
      var gas_price = "1000000"
      var gas_limit = "2000000"
      var callFunction = "checkAccount";
      var callArgs = ''; //in the form of ["args"]
      var contract = {
        "function": callFunction,
        "args": callArgs
      }

this.neb.api.call($this.wallet_key,$this.contract_address,value,nonce,gas_price,gas_limit,contract).then(function (resp) {
console.log('resp:',resp);
      }).catch(function (err) {
        console.log("error:" + err.message)
      })

交易接口调用

交易接口的调用可以用官方提供的nebpay库，也可以直接用nebulas库，如果用nebulas库需要像web-wallet里面合约调用页面一样，需要用户上传钱包文件来获取钱包信息，而这是官方不推荐的。

使用nebpay库，DApp的用户需要安装浏览器插件-桌面端（WebExtensionWallet）或钱包APP-移动端（星云官方APP钱包）来完成Dapp页面发起的交易请求。开发阶段测试交易都需要安装。

更多关于nebpay的信息请参考官方文档如何在Dapp中使用NebPay SDK

nebpay库引入

根据你的应用构建方式的不同，你可以选择直接在页面引入js库或者npm install模块。

页面直接引用

需要在github下载NebPay源码，然后打包生成nebpay.js。
nebPay源码
或者也可以直接从这里下载jsnebPay.js
<script type="text/javascript" src="nebPay.js"></script>

node模块化安装

npm install nebpay -D

页面调用nebpay库

初始化nebpay

this.nebpay = new NebPay();

调用api

      var $this = this;
      var value = this.principal;
      var callFunction = "save";
      var callArgs = ''; //in the form of ["args"]
      var serialNumber;
      serialNumber = this.nebPay.call($this.contract_address, value, callFunction, callArgs, {    //使用nebpay的call接口去调用合约,
        listener: function (resp) {
console.log('resp:',resp);
        }        //设置listener, 处理交易返回信息
      });

参照例子写好合约调用的代码，就可以先在本地测试了。一般来说，在三、创建合约小节里测试过合约调用成功的，代码里调用也不会有问题。

在这里附上官方的例子供参考超级图书馆

至此我们的应用就是一个DApp啦，只需要最后一步五、部署和提交就可以角逐大奖了！