安装neb.js
neb.js提供javascript开发的API接口
1.创建一个neb文件夹，在终端命令行中进入该文件夹，克隆neb.js
git clone https://github.com/nebulasio/neb.js.git
2.会新建一个neb.js文件夹，进入该文件夹，安装所有依赖
npm install
3.安装gulp
npm install gulp
4.打包生成neb.js等文件
gulp
5.执行成功会生成/dist文件夹，文件夹中会生成我们要使用js文件。
- neb.js:Used in browser side. Including outside dependency.
- neb-light.js:Used in Repl console. Not including outside dependency.
- nebulas.js: Fully functional in the browser. Users can create an address, sign a transaction, and deploy/call a smart contract.
安装nebPay
NebPay SDK 为不同平台的交易提供了统一的支付接口，开发者在Dapp页面中使用NebPay API可以通过浏览器插件钱包、手机app钱包等实现交易支付和合约调用。
github地址：https://github.com/nebulasio/nebPay
安装方法同上，会生成nebPay.js文件
Dapp开发
将生产的nebulas.js和nebPay.js放在libs文件夹下，例如下图：
course.js源码如下:
'use strict';
var courseContract = function () {
LocalContractStorage.defineProperty(this, "size");
}
courseContract.prototype = {
init: function () {
this.size = 0;
},
save: function (value) {
this.size = value;
},
read: function () {
return this.size;
}
};
module.exports = courseContract;
course.html源码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Course</title>
<script src="libs/jquery-3.3.1.min.js"></script>
<script src="libs/nebPay.js"></script>
<script src="libs/nebulas.js"></script>
<link rel="stylesheet" href="css/bootstrap.min.css">
</head>
<body>
<input type="text" class="form-control" style="margin-top: 20px; height: 40px;"
id="line1">
<button type="button" style="margin-top: 10px;" class="btn btn-primary btn-lg btn-block" id="save">保存</button>
<button type="button" style="margin-top: 10px;" class="btn btn-primary btn-lg btn-block" id="read">读取</button>
<div id="value" style="font-size: 20px; color: red"></div>
<script>
var dappAddress = "n1uSBFi4JnGtUNu8mGKmdF5orMg8b7GnN7w";
var NebPay = require("nebpay");
var nebPay = new NebPay();
$("#save").click(function () {
var str = $("#line1").val().trim();
var callArgs = "[\"" + str + "\"]";
nebPay.call(dappAddress, "0", "save", callArgs, {
listener: function (resp) {
}
});
});
$("#read").click(function () {
var callArgs = "[]";
nebPay.simulateCall(dappAddress, "0", "read", callArgs, {
listener: function (resp) {
$("#value").html(resp.result);
}
});
});
</script>
</body>
</html>
上面的源码使用了nebPay的方式调用智能合约中的方法，我们还可以使用nebulas中api.call的方式调用智能合约中的方法，例如：
<script>
var dappAddress = "n1uSBFi4JnGtUNu8mGKmdF5orMg8b7GnN7w";
var NebPay = require("nebpay");
var nebPay = new NebPay();
// 直接访问星云链的api
var nebulas = require("nebulas"), Account = nebulas.Account, neb = new nebulas.Neb();
// 设置使用的网络
neb.setRequest(new nebulas.HttpRequest("https://testnet.nebulas.io"));
$("#save").click(function () {
var str = $("#line1").val().trim();
var callArgs = "[\"" + str + "\"]";
nebPay.call(dappAddress, "0", "save", callArgs, {
listener: function (resp) {
}
});
});
/* $("#read").click(function () {
var callArgs = "[]";
nebPay.simulateCall(dappAddress, "0", "read", callArgs, {
listener: function (resp) {
$("#value").html(resp.result);
}
});
});
*/
$("#read").click(function () {
var from = Account.NewAccount().getAddressString();
var value = "0"; // 金额
var nonce = "1"; // 交易序号
var gas_price = "1000000" // 手续费价格
var gas_limit = "2000000" // 手续费限制
var callFunction = "read";
var callArgs = "[]"; //in the form of ["args"]
var contract = { // 合约
"function": callFunction, // 方法名
"args": callArgs // 参数
}
// 使用api.call执行合约中的方法
neb.api.call(from, dappAddress, value, nonce, gas_price, gas_limit, contract).then(function (resp) {
$("#value").html(resp.result);
}).catch(function (err) {
$("#value").html("error:" + err.message);
})
});
</script>
运行Dapp
第一步
第二步
第三步
第四步
到此为止，一个基于星云链的Dapp就开发完成了，不要吐槽举例的Dapp太简单了，重在演示过程。
