Day 22【Tokens' Owner】你好啊大哥哥，真没想到你可以到二十三楼来呢！不过就到这里为止了，接下来由我欧喷系的JS来做你的对手！

【前言】
既然没有办法用既有的资源找出 Ownership，那我就自己写！但 Opensea.js 真的因为资源不多所以学习的过程非常困难阿！感觉就像打到了快要顶的怪塔，结果遇见锁链的康尼的感觉一样，是一个半路杀出来的违和魔王阿。

【纸上谈兵】
这边先延续之前 opensea.js 的部分，导入一些套件然後进行一些基本的连线！

import * as Web3 from 'web3'
import React, { useEffect, useState } from "react";
import { OpenSeaPort, Network } from 'opensea-js'
import styled from "styled-components";

const provider = new Web3.providers.HttpProvider('https://mainnet.infura.io')

const seaport = new OpenSeaPort(provider, {
  networkName: Network.Main
})

首先进行一些基本的宣告，a 被我定义成我现在想要找的 Asset 的物件，因为不想跟真实回传的 Asset 搞混所以这边改叫做 a。想当然 accountAddress 就是现在登入者的帐号啦！而 OwnerShip 也非常浅显易懂就是确认这个 OwnerShip 是不是成立。

export function OwnerOf(props) {
  const [a, setA] = useState({
    tokenAddress: "", 
    tokenId: "",
    schemaName: 'ERC721'
  });
  const [accountAddress, setAccountAddress] = useState("")
  const [OwnerShip, setOwnerShip] = useState(false)
  ...
  return (
    ...
  );
}

这边使用 useEffect() 随时更新，利用 async 匿名同步函数来取得资料。其中 balance 会利用 seaport.getAssetBalance() 来回传一个 BigNumber 代表持有状态。其中的 accountAddress 与 Asset 当然就是利用上面宣告过的资料啦！

export function OwnerOf(props) {
  ...
  useEffect(() => {
    const fetchData = async () => {
      const balance = await seaport.getAssetBalance({
        accountAddress: accountAddress,
        asset: {
          tokenAddress: a.tokenAddress,
          tokenId: a.tokenId,
          schemaName: a.schemaName
         },
      })
      console.log(balance);
    };
    fetchData();
  }, []);

  return (
    ...
  );
}

【提枪上阵】
因为我没有持有任何 NFT，所以这边先借一下麻吉大哥的帐号还有他的猴子 NFT测试一下！

Bored Ape Yacht Club - With MachiBigBrother Ethereum Address

useEffect(() => {
    const fetchData = async () => {
      const balance = await seaport.getAssetBalance({
        accountAddress: '0x020ca66c30bec2c4fe3861a94e4db4a498a35872',
				// https://opensea.io/MachiBigBrother
        asset: {
          tokenAddress: "0xBC4CA0EdA7647A8aB7C2061c2E118A18a936f13D",
					// https://opensea.io/assets/0xbc4ca0eda7647a8ab7c2061c2e118a18a936f13d/6445
          tokenId: "6445",
          schemaName: 'ERC721',
         },
      })
      console.log(balance);
    };
    fetchData();
  }, []);

测试成功！

试试看用我的以太坊帐号~~（大家可以 Donate 给我欧）~~。

Bored Ape Yacht Club - With My Ethereum Address

useEffect(() => {
    const fetchData = async () => {
      const balance = await seaport.getAssetBalance({
        accountAddress: '0x7E4c2f441f615fF4a8E275319a2182F66b0963F7',
        asset: {
          tokenAddress: "0xBC4CA0EdA7647A8aB7C2061c2E118A18a936f13D",
					// https://opensea.io/assets/0xbc4ca0eda7647a8ab7c2061c2e118a18a936f13d/6445
          tokenId: "6445",
          schemaName: 'ERC721',
         },
      })
      console.log(balance);
    };
    fetchData();
  }, []);

结论是 0！

CHECKER FLASE.png

再来试试看麻吉大哥另外拥有的一个 NFT 来确认也是成功！

Bored Ape Kennel Club - With MachiBigBrother Ethereum Address

useEffect(() => {
    const fetchData = async () => {
      const balance = await seaport.getAssetBalance({
        accountAddress: '0x020ca66c30bec2c4fe3861a94e4db4a498a35872',
				// https://opensea.io/MachiBigBrother
        asset: {
          tokenAddress: "0xba30E5F9Bb24caa003E9f2f0497Ad287FDF95623",
					// https://opensea.io/assets/0xba30e5f9bb24caa003e9f2f0497ad287fdf95623/6380
          tokenId: "6380",
          schemaName: 'ERC721',
         },
      })
      console.log(balance);
    };
    fetchData();
  }, []);

目前已知架设在 Polygon 上的 NFT 没办法使用这个服务，会有错误报说当前 smart contract 没办法找到 Owner，这也是 opensea.js 讨论区里面一个被热烈讨论的问题，希望之後开发者会有机会开发出这个功能！为这个世界上提供程序码的天使们祈祷！

【Big Number.js】
这边微微微微微微补充说明一下 Big Number 这个东西！顾名思义他就是一个大数用的数学工具，也是一个有用的 (512-bit, 1024-bit) RSA 加密工具。

bignumber

其实他除了拥有许多数学工具之外，在回传的时候里面会有三个东东出现。这边就不多作介绍里面的工具了，有兴趣的朋友可以直接去他们的 Doc 看看！

c 表 coefficient，也就是系数。是一个以 1e14 范围内呈现的数字阵列。
e 表 exponent，也就是指数。会是一个介在 -1000000000 和 1000000000 之间的整数
s 表 sign，也就是正负号。以 -1 或 1 表示。

c, e 以及 s 皆可以为 null，以下可以看看官方文件提供的例子！

x = new BigNumber(0.123)              // '0.123'
x.toExponential()                     // '1.23e-1'
x.c                                   // '1,2,3'
x.e                                   // -1
x.s                                   // 1

y = new Number(-123.4567000e+2)       // '-12345.67'
y.toExponential()                     // '-1.234567e+4'
z = new BigNumber('-123.4567000e+2')  // '-12345.67'
z.toExponential()                     // '-1.234567e+4'
z.c                                   // '1,2,3,4,5,6,7'
z.e                                   // 4
z.s                                   // -1

【小结】
这边算是测试成功啦，自从那天下载 opensea.js 失败之後，目前为止算是蛮顺利的！真的是非常庆幸阿。明天就要把这个页面跟其他页面连接在一起，如果连接成功的话这个 Project 就几乎要结束啦！衷心祈祷不要出什麽大问题。