More than 1 year has passed since last update.

ethers.jsのオブジェクトを眺めてみる

Last updated at 2022-04-08Posted at 2022-04-08

「霊園ガイド」サイト開発日記の高橋です。＜誰も知らんがな＜お約束

前回は、web3.jsをほぼゼロからGCPのVM(Ubuntu)に入れてみるということで、勇んでweb3.jsを始めようとしていたのですが、

「web3.jsより最近はethers.jsが人気あるよ？」とのうわさを耳にして、急遽、方針転換し、前回構築したGCPのVMをそのまま使ってethers.jsを勉強していくことにしました。すみません。

君子豹変すなのであり、気を見るに敏、なのであります。＜三日坊主ですらない

さて、そういうことで朝令ではweb3.jsがテキストでしたが、暮れてから改定したテキストはこちら
https://docs.ethers.io/v5/

ethers.jsです。きっぱり。

一応、web3.jsもethers.jsもJavaScriptからEthereum nodeにJSON RPCで接続してあそべるライブラリですが、ethers.jsの方が新しく、web3.jsの方が歴史があります。

ただ最近は、期間を区切ると ethers.js の方がダウンロード数が多く「最近はethers.jsが人気あるよ」を裏付けてるような気もします。

詳しい比較情報はこちらに譲ります。

web3.jsとethers.jsのどちらを使うべきか(両者の比較)
https://zenn.dev/nft/books/410be300912936/viewer/0a5ab8

では、Getting Startedページから始めます。

Getting Started

テキストはこのページです
https://docs.ethers.io/v5/getting-started/
gitではここ
https://github.com/ethers-io/ethers.js

Installing

インストールのためのコードはこう書いてあります。

/home/ricmoo> npm install --save ethers

因みに --saveは、npmのオプションで package.json の dependencies に追記してくれるものですが npm v5 以降なら勝手にやってくれるので不要です。

あと、ricmoo は作者の名前で、github の説明では、「/home/ricmoo/some_project> npm install --save ethers」となっています。

さてGCPにVMを作るところは前回終わったので、とりま ethers というディレクトリを作って進めようと思います

mkdir ethers
cd ethers

こんな感じで今回は、/home/web3/ethersというディレクトリができました。web3.jsのつもりだったので名前がweb3なのは許してください(^^;

一応、/home/web3/ethersにいれるモジュールは他と混ぜたくないので、このディレクトリにnode_modulesディレクトリを作っておきます。

mkdir node_modules

そして、ethersをインストール

npm i ethers

どうかな？

ls -l
total 60
drwxrwxr-x 17 info info  4096 Apr  8 11:45 node_modules
-rw-rw-r--  1 info info 51991 Apr  8 11:45 package-lock.json
-rw-rw-r--  1 info info    51 Apr  8 11:45 package.json

#package.jsonに入ってるかな？
cat package.json
{
  "dependencies": {
    "ethers": "^5.6.2"
  }
}

v5.6.2が入りました。

Importing

次はNode.jsまたはブラウザ内にインポートする方法です。

Node.jsでもブラウザでも読み込めるので夢ひろがりんぐではありますが、特にコードがむき出しのブラウザ側ではお金の絡むことではありますので慎重さが必要かなぁとは思います。個人的には自分の libra-Auth 的な使い道に使えそうで少しわくわくしてきました＾＾

Node.js

const { ethers } = require("ethers"); #requireの場合

import { ethers } from "ethers"; #ES6 or TypeScriptの場合

Web Browser

<!--ES6 in the Browserの場合-->
<script type="module">
    import { ethers } from "https://cdn.ethers.io/lib/ethers-5.2.esm.min.js";
    // Your code here...
</script>

<!--ES3 (UMD) in the Browserの場合-->
<script src="https://cdn.ethers.io/lib/ethers-5.2.umd.min.js"
        type="application/javascript"></script>

読み込んだethers オブジェクトを確認してみる

ここで前回同様に、テキストを離れて、読み込まれたethers オブジェクトを確認してみます。

mkdir test
vi test/test1.js

作業用のtestディレクトリを作りそこに「test1.js」というファイルを置きます。
中身はこんな感じ。

Node.js

const { ethers } = require("ethers");
console.log(ethers)

実行してみます

node test/test1.js

読み込まれた ethers オブジェクトが出力されました。
API のページにあるメソッドなどが並んでいるように見えます。
では、この辺を覗きながら試していけばよいのかな。

{
  Signer: [Getter],
  Wallet: [Getter],
  VoidSigner: [Getter],
  getDefaultProvider: [Getter],
  providers: {
    Provider: [Getter],
    BaseProvider: [Getter],
    Resolver: [Getter],
    UrlJsonRpcProvider: [Getter],
    FallbackProvider: [Getter],
    AlchemyProvider: [Getter],
    AlchemyWebSocketProvider: [Getter],
    AnkrProvider: [Getter],
    CloudflareProvider: [Getter],
    EtherscanProvider: [Getter],
    InfuraProvider: [Getter],
    InfuraWebSocketProvider: [Getter],
    JsonRpcProvider: [Getter],
    JsonRpcBatchProvider: [Getter],
    NodesmithProvider: [Getter],
    PocketProvider: [Getter],
    StaticJsonRpcProvider: [Getter],
    Web3Provider: [Getter],
    WebSocketProvider: [Getter],
    IpcProvider: [Getter],
    JsonRpcSigner: [Getter],
    getDefaultProvider: [Function: getDefaultProvider],
    getNetwork: [Getter],
    isCommunityResource: [Getter],
    isCommunityResourcable: [Getter],
    showThrottleMessage: [Getter],
    Formatter: [Getter]
  },
  BaseContract: [Getter],
  Contract: [Getter],
  ContractFactory: [Getter],
  BigNumber: [Getter],
  FixedNumber: [Getter],
  constants: {
    AddressZero: [Getter],
    NegativeOne: [Getter],
    Zero: [Getter],
    One: [Getter],
    Two: [Getter],
    WeiPerEther: [Getter],
    MaxUint256: [Getter],
    MinInt256: [Getter],
    MaxInt256: [Getter],
    HashZero: [Getter],
    EtherSymbol: [Getter]
  },
  errors: [Getter],
  logger: Logger { version: 'ethers/5.6.2' },
  utils: {
    AbiCoder: [Getter],
    defaultAbiCoder: [Getter],
    Fragment: [Getter],
    ConstructorFragment: [Getter],
    ErrorFragment: [Getter],
    EventFragment: [Getter],
    FunctionFragment: [Getter],
    ParamType: [Getter],
    FormatTypes: [Getter],
    checkResultErrors: [Getter],
    Logger: [Getter],
    RLP: { encode: [Function: encode], decode: [Function: decode] },
    _fetchData: [Getter],
    fetchJson: [Getter],
    poll: [Getter],
    checkProperties: [Getter],
    deepCopy: [Getter],
    defineReadOnly: [Getter],
    getStatic: [Getter],
    resolveProperties: [Getter],
    shallowCopy: [Getter],
    arrayify: [Getter],
    concat: [Getter],
    stripZeros: [Getter],
    zeroPad: [Getter],
    isBytes: [Getter],
    isBytesLike: [Getter],
    defaultPath: [Getter],
    HDNode: [Getter],
    SigningKey: [Getter],
    Interface: [Getter],
    LogDescription: [Getter],
    TransactionDescription: [Getter],
    base58: [Getter],
    base64: { decode: [Getter], encode: [Getter] },
    hexlify: [Getter],
    isHexString: [Getter],
    hexConcat: [Getter],
    hexStripZeros: [Getter],
    hexValue: [Getter],
    hexZeroPad: [Getter],
    hexDataLength: [Getter],
    hexDataSlice: [Getter],
    nameprep: [Getter],
    _toEscapedUtf8String: [Getter],
    toUtf8Bytes: [Getter],
    toUtf8CodePoints: [Getter],
    toUtf8String: [Getter],
    Utf8ErrorFuncs: [Getter],
    formatBytes32String: [Getter],
    parseBytes32String: [Getter],
    dnsEncode: [Getter],
    hashMessage: [Getter],
    namehash: [Getter],
    isValidName: [Getter],
    id: [Getter],
    _TypedDataEncoder: [Getter],
    getAddress: [Getter],
    getIcapAddress: [Getter],
    getContractAddress: [Getter],
    getCreate2Address: [Getter],
    isAddress: [Getter],
    formatEther: [Getter],
    parseEther: [Getter],
    formatUnits: [Getter],
    parseUnits: [Getter],
    commify: [Getter],
    computeHmac: [Getter],
    keccak256: [Getter],
    ripemd160: [Getter],
    sha256: [Getter],
    sha512: [Getter],
    randomBytes: [Getter],
    shuffled: [Getter],
    solidityPack: [Getter],
    solidityKeccak256: [Getter],
    soliditySha256: [Getter],
    splitSignature: [Getter],
    joinSignature: [Getter],
    accessListify: [Getter],
    parseTransaction: [Getter],
    serializeTransaction: [Getter],
    TransactionTypes: [Getter],
    getJsonWalletAddress: [Getter],
    computeAddress: [Getter],
    recoverAddress: [Getter],
    computePublicKey: [Getter],
    recoverPublicKey: [Getter],
    verifyMessage: [Getter],
    verifyTypedData: [Getter],
    getAccountPath: [Getter],
    mnemonicToEntropy: [Getter],
    entropyToMnemonic: [Getter],
    isValidMnemonic: [Getter],
    mnemonicToSeed: [Getter],
    SupportedAlgorithm: [Getter],
    UnicodeNormalizationForm: [Getter],
    Utf8ErrorReason: [Getter],
    Indexed: [Getter]
  },
  wordlists: [Getter],
  version: [Getter],
  Wordlist: [Getter]
}

今日はここまで。

You get articles that match your needs
You can efficiently read back useful information
You can use dark theme

What you can do with signing up