129孤荷凌寒自学第0215天_区块链第129天NFT026

2024-01-05 16:04:10

【主要内容】

今天继续自己开始写一个前端html页来与合约进行交互，效率比昨天还低下，完成了第三个和第四个合约调用项的成功测试。共耗时41分钟。

（此外整理作笔记花费了约26分钟）

详细学习过程见文末学习过程屏幕录像。

【新的Html前端页面】

```

<!DOCTYPE html>

<html>

<head>

</head>

<body>

<div>

<p>

nft资产合约地址：

</p>

</p>

</p>

</p>

</p>

</p>

</div>

<div>

<span>查询所有资产的授权关系是否存在</span>

<br />

<span>授权方节点地址：</span>

<br />

<span>受托方节点地址：</span>

<br />

<br />

```

nftmain.js的内容：

```

function isNumber(val) { //https://www.cnblogs.com/wangyunhui/p/8981813.html

var regPos = /^\d+(\.\d+)?$/; //非负浮点数

var regNeg = /^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$/; //负浮点数

if(regPos.test(val) || regNeg.test(val)) {

return true;

} else {

return false;

}

// 格式化日期，如月、日、时、分、秒保证为2位数

function formatNumber (n) {

n = n.toString()

return n[1] ? n : '0' + n;

}

// 参数number为毫秒时间戳，format为需要转换成的日期格式

function formatTime (number, format) {

let time = new Date(number)

let newArr = []

let formatArr = ['Y', 'M', 'D', 'h', 'm', 's']

newArr.push(time.getFullYear())

newArr.push(formatNumber(time.getMonth() + 1))

newArr.push(formatNumber(time.getDate()))

newArr.push(formatNumber(time.getHours()))

newArr.push(formatNumber(time.getMinutes()))

newArr.push(formatNumber(time.getSeconds()))

for (let i in newArr) {

format = format.replace(formatArr[i], newArr[i])

}

return format;

}

//声明一些钱包地址：

//下面一行定义的是部署合约的节点（创世节点）的信息，公钥

var wallet_address="0x5227C3EF48B5A1bcF784593e46D9579D26a3b592"; //狐狸钱包的公钥，就是钱包地址，是eth网络上的一个节点。

//下面一行定义的是节点2的信息

var w2add="0xe2d6c2f289c53B5aEA44C47293Ba179a3bfa21f0"; //公钥

//下面一行定义的是节点3 的信息

var w3add="0xb40599fB0366DCf0ffe86677b005b3f20Dfa29aE"; //公钥

//下面一行定义的是节点4 的信息

var w4add="0x70c8461366d5368B1E79CBFc2Acf4ba56C745977"; //公钥

// 2. Start code here

var cc;

var web3;

//----下面是StandardAssetRegistryTest的合约地址

var heyueAddress='0xeD4202E35c63EDfDC38Fff34100Ac86217960DD3';

function startApp() {

try {

$("#contractaddress").html(heyueAddress);

var ccc=web3.eth.contract(nftABI);

cc=ccc.at(heyueAddress); //https://www.cnblogs.com/tinyxiong/p/9046626.html

//cc =new web3.eth.contract(cryptozombiesABI, cryptoZombiesAddress); //如果是另一个版本可能还得加上new关键字。

$("#firstinfo").html("连接上合约！")

//alert(typeof cc);

web3.eth.getAccounts(function (err, accounts) {

if (accounts.length == 0) {

$("#firstinfo").html("请检查钱包是否解锁");

}else{

$("#accountsinfo").html("获取的默认钱包地址：" + web3.eth.defaultAccount);

//getCurGift();

}

});

} catch (err) {

alert(err);

}

$("#firstinfo").html("加载成功");

}

//async () =>

//现在这种通过we3.min.js来加载钱包连接的方法，在metamask钱包和麦子钱包中都测试通过。

window.addEventListener('load',function() {

try{

if (typeof web3 !== 'undefined') {

web3 = new Web3(web3.currentProvider);

startApp();

} else {

//$('#app_loading').hide();

//alert(jQuery.i18n.prop('lrn_error_alert'));

//mathWallet.closePage();

alert("这儿没有钱包环境。");

}

}catch(err){

alert(err);

}

});

//===========================================================================================

//----------------下面是自定义的与合约交互的函数-------------------------

//--查询指定节点的NFT资产数量-----

function cmdone_click(){

try{

querryaddressbalance();

}catch(err){

alert(err);

}

//--查询指定节点的资产余额---

function querryaddressbalance(){

try{

var a=document.getElementById("txtaddressforone").value;

if(a!=""){

cc.balanceOf(a,function(error, result){

if(!error)

{

//var da=result[0];

//var xi=result[1];

//var intda=da / (10**18);

//var intxi=xi / (10**18);

$("#total").html("当前地址拥有：" + result + "个资产");

//alert(result);

}

else{

//alert(error);

$("#total").html('获取出错：' + error);

}});

//return "ok"

$("#total").html('正在获取。。。');

}else{

alert("请先填写正确的节点地址。");

}

}catch(err){

$("#total").html('出错：' + err);

}

//---------------------------------------------------------

//--查询指定ID的NFT资产是否存在---

function cmdone2_click(){

try{

var strid=document.getElementById("txtnftidfortwo").value;

if(isNumber(strid)==true){

var nid=parseInt(strid);

isnftexist(nid);

}

}catch(err){

alert(err);

}

function isnftexist(intid){

try{

cc.exists(intid,function(error, result){

//alert(result);

//alert(result.toString + "---"); //如果这样写toString那么就返回一个函数对象而不是字符串，要加括号！

if(!error)

{

var strls=result.toString();

//alert(strls);

if(strls.search("true")>=0){

$("#total2").html("id为" + intid + "的nft资产存在。");

}else{

$("#total2").html("id为" + intid + "的nft资产不存在。");

}

else{

//alert(error);

$("#total2").html('获取出错：' + error);

}});

//return "ok"

$("#total2").html('正在获取。。。');

}catch(err){

$("#total2").html('出错：' + err);

}

//------------------------------------------------------------------------------------

//查询指定ID的NFT资产已授权给哪个节点地址

function cmdtwo_click(){

try{

var strid=document.getElementById("txtnftidfortwo2").value;

if(isNumber(strid)==true){

var nid=parseInt(strid);

getApproved(nid);

}

}catch(err){

alert(err);

}

//查询指定ID的NFT资产已授权给哪个节点地址

function getApproved(intid){

try{

cc.getApproved(intid,function(error, result){

//alert(result);

if(!error)

{

var strls=result.toString();

if(strls.search("0x0000000000000000000000000000000000000000")>=0){

document.getElementById("spanapprove").innerText="此资产并没有授权给任何节点";

}else{

document.getElementById("spanapprove").innerText="此资产已授权给：" + result;

}

else{

//alert(error);

document.getElementById("spanapprove").innerText='获取出错：' + error;

}});

//return "ok"

document.getElementById("spanapprove").innerText='正在获取。。。';

}catch(err){

alert("使用授权代币转移时出错：" + err)

return err;

}

//----------------------------------------------------------------------------------------

//--查询一个节点是不是向另一个节点授权了所有资产的操作权-----------------

function cmdthree_click(){

try{

var strholder=document.getElementById("txtaddressforthreeholder").value;

var stroperator=document.getElementById("txtaddressforthreeoperator").value;

//alert(strholder);

//alert(stroperator);

if(strholder!="" && stroperator!=""){

isApprovedForAll(strholder,stroperator);

}else{

alert("请先输入两个节点的地址。");

}

}catch(err){

alert(err);

}

function isApprovedForAll(strholder,stroperator){

try{

alert(strholder);

alert(stroperator);

cc.isApprovedForAll(strholder,stroperator,function(error, result){

if(!error)

{

var strls=result.toString();

//alert(strls);

if(strls.search("true")>=0){

document.getElementById("allapproveaddress").innerText='授权关系存在。';

}else{

document.getElementById("allapproveaddress").innerText='授权关系不存在。';

}

else{

//alert(error);

document.getElementById("allapproveaddress").innerText='获取出错：' + error;

}});

//return "ok"

document.getElementById("allapproveaddress").innerText='获取中.....';

}catch(err){

alert("查询出错：" + err)

return err;

}

```

【整理的js的相关内容】

1.js中居然没有原生的trim()这样的字符串方法。

2.js中的subString()方法是获取指定起始字符之间的子字符串的方法

JavaScript substring() 方法

（来自于：https://www.w3school.com.cn/js/jsref_substring.asp ）

stringObject.substring(start,stop)

参数描述

start 必需。一个非负的整数，规定要提取的子串的第一个字符在 stringObject 中的位置。

stop 可选。一个非负的整数，比要提取的子串的最后一个字符在 stringObject 中的位置多 1。如果省略该参数，那么返回的子串会一直到字符串的结尾。

返回值

一个新的字符串，该字符串值包含 stringObject 的一个子字符串，其内容是从 start 处到 stop-1 处的所有字符，其长度为 stop 减 start。

说明

substring() 方法返回的子串包括 start 处的字符，但不包括 stop 处的字符。

如果参数 start 与 stop 相等，那么该方法返回的就是一个空串（即长度为 0 的字符串）。如果 start 比 stop 大，那么该方法在提取子串之前会先交换这两个参数。

3.js中判断一个字符串是否包含另一个字符串，使用

(1)search()方法

(2)indexOf方法

这两个方法都是字符串对象的方法。返回起始字符位置的index值（从0开始计数）

4.关于toString()方法

最开始使用在判断表达式中出错。后面单独写成一行语句又正确。

使用时一定要加方法后面的括号。

5.常见错误

今天又犯了一次最低级的常见错误

正确的写法：

```

var strholder=document.getElementById("txtaddressforthreeholder").value;

var stroperator=document.getElementById("txtaddressforthreeoperator").value;

```

错误写法：

```

var strholder=document.getElementById("txtaddressforthreeholder");

var stroperator=document.getElementById("txtaddressforthreeoperator");

```

就算按错误的写法，在下面的代码执行字符串是否为空的检查时，不会出现异常，还会把值传递出去。

```

if(strholder!="" && stroperator!=""){

isApprovedForAll(strholder,stroperator);

}else{

alert("请先输入两个节点的地址。");

}

```

会把获取到的两个element对象直接传递给函数：isApprovedForAll

直到与智能合约交互时，合约会因为收到了两个element对象而报错。

github: https://github.com/lhghroom/Self-learning-blockchain-from-scratch

原文地址：

【欢迎大家加入[就是要学]社群】

如今，这个世界的变化与科技的发展就像一个机器猛兽，它跑得越来越快，跑得越来越快，在我们身后追赶着我们。

很多人很早就放弃了成长，也就放弃了继续奔跑，多数人保持终身不变的样子，原地不动，成为那猛兽的肚中餐——当然那也不错，在猛兽的逼迫下，机械的重复着自我感觉还良好地稳定工作与生活——而且多半感觉不到这有什么不正常的地方，因为在猛兽肚子里的是大多数人，就好像大多数人都在一个大坑里，也就感觉不出来这是一个大坑了，反而坑外的世界显得有些不大正常。

为什么我们不要做坑里的大多数人？

因为真正的人生，应当有百万种可能；因为真正的一生可以有好多辈子组成，每一辈子都可以做自己喜欢的事情；因为真正的人生，应当有无数种可以选择的权利，而不是总觉得自己别无选择。因为我们要成为一九法则中为数不多的那个一；因为我们要成为自己人生的导演而不是*成为别人安排的戏目中的演员。

【请注意】

就是要学社群并不会告诉你怎样一夜暴富！也不会告诉你怎样不经努力就实现梦想！

【请注意】

就是要学社群并没有任何可以应付未来一切变化的独门绝技，也没有值得吹嘘的所谓价值连城的成功学方法论！

【请注意】

社群只会互相帮助，让每个人都看清自己在哪儿，自己是怎样的，重新看见心中的梦想，唤醒各自内心中的那个英雄，然后勇往直前，成为自己想要成为的样子！

期待与你并肩奔赴未来！

QQ群：646854445 （【就是要学】终身成长）

【原文地址】

https://www.941xue.com/content.aspx?id=1749

【同步语音笔记】

https://www.ximalaya.com/keji/19103006/361330893

【学习过程屏幕录屏】

https://www.bilibili.com/video/BV1YD4y1R7US

码农公寓

相关文章