refactor: migrate axios to fetch (#564)

Author: homura

.changeset/red-rings-approve.md

@@ -0,0 +1,5 @@
+---
+"@ckb-lumos/rpc": minor
+---
+
+Replace the HTTP client `axios` with the native supported `fetch` to avoid the modifying the default adapter of axios 

packages/rpc/__tests__/ckb-rpc.test.js

@@ -1,8 +1,18 @@
 /* eslint-disable max-len */
+/** mock template start **/
+jest.mock("cross-fetch");
+const axiosMock = require("cross-fetch").default;
+
+beforeAll(() => {
+  const originalResolve = axiosMock.mockResolvedValue;
+  axiosMock.mockResolvedValue = (value) =>
+    originalResolve({
+      json: () => Promise.resolve(value.data),
+    });
+});
 
-jest.mock("axios");
+/** mock template end **/
 
-const axiosMock = require("axios");
 const { CKBRPC, ResultFormatter } = require("../lib");
 
 describe("Test with mock", () => {
@@ -94,7 +104,7 @@ describe("Test with mock", () => {
         },
       });
       const res = await rpc.getBlockByNumber(BLOCK_NUMBER);
-      expect(axiosMock.mock.calls[0][0].data).toEqual({
+      expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
         id,
         jsonrpc: "2.0",
         method: "get_block_by_number",
@@ -175,7 +185,7 @@ describe("Test with mock", () => {
         },
       });
       const res = await rpc.txPoolInfo();
-      expect(axiosMock.mock.calls[0][0].data).toEqual({
+      expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
         id,
         jsonrpc: "2.0",
         method: "tx_pool_info",
@@ -202,7 +212,7 @@ describe("Test with mock", () => {
       });
 
       const res = await rpc.clearTxPool();
-      expect(axiosMock.mock.calls[0][0].data).toEqual({
+      expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
         id,
         jsonrpc: "2.0",
         method: "clear_tx_pool",
@@ -245,7 +255,7 @@ describe("Test with mock", () => {
         });
 
         const res = await rpc.getRawTxPool(true);
-        expect(axiosMock.mock.calls[0][0].data).toEqual({
+        expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
           id,
           jsonrpc: "2.0",
           method: "get_raw_tx_pool",
@@ -292,7 +302,7 @@ describe("Test with mock", () => {
         });
 
         const res = await rpc.getRawTxPool(false);
-        expect(axiosMock.mock.calls[0][0].data).toEqual({
+        expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
           id,
           jsonrpc: "2.0",
           method: "get_raw_tx_pool",
@@ -321,7 +331,7 @@ describe("Test with mock", () => {
         });
 
         const res = await rpc.getRawTxPool(null);
-        expect(axiosMock.mock.calls[0][0].data).toEqual({
+        expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
           id,
           jsonrpc: "2.0",
           method: "get_raw_tx_pool",
@@ -350,7 +360,7 @@ describe("Test with mock", () => {
         });
 
         const res = await rpc.getRawTxPool();
-        expect(axiosMock.mock.calls[0][0].data).toEqual({
+        expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
           id,
           jsonrpc: "2.0",
           method: "get_raw_tx_pool",
@@ -379,7 +389,7 @@ describe("Test with mock", () => {
         },
       });
       const res = await rpc.getCurrentEpoch();
-      expect(axiosMock.mock.calls[0][0].data).toEqual({
+      expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
         id,
         jsonrpc: "2.0",
         method: "get_current_epoch",
@@ -407,7 +417,7 @@ describe("Test with mock", () => {
         },
       });
       const res = await rpc.getEpochByNumber(BLOCK_NUMBER);
-      expect(axiosMock.mock.calls[0][0].data).toEqual({
+      expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
         id,
         jsonrpc: "2.0",
         method: "get_epoch_by_number",
@@ -438,7 +448,7 @@ describe("Test with mock", () => {
         },
       });
       const res = await rpc.getCellbaseOutputCapacityDetails(BLOCK_HASH);
-      expect(axiosMock.mock.calls[0][0].data).toEqual({
+      expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
         id,
         jsonrpc: "2.0",
         method: "get_cellbase_output_capacity_details",
@@ -469,7 +479,7 @@ describe("Test with mock", () => {
         },
       });
       const res = await rpc.calculateDaoMaximumWithdraw(...PARAMS);
-      expect(axiosMock.mock.calls[0][0].data).toEqual({
+      expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
         id,
         jsonrpc: "2.0",
         method: "calculate_dao_maximum_withdraw",
@@ -510,7 +520,7 @@ describe("Test with mock", () => {
         },
       });
       const res = await rpc.getBlockEconomicState(BLOCK_HASH);
-      expect(axiosMock.mock.calls[0][0].data).toEqual({
+      expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
         id,
         jsonrpc: "2.0",
         method: "get_block_economic_state",
@@ -564,7 +574,7 @@ describe("Test with mock", () => {
           TRANSACTION_HASHES,
           BLOCK_HASH
         );
-        expect(axiosMock.mock.calls[0][0].data).toEqual({
+        expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
           id,
           jsonrpc: "2.0",
           method: "get_transaction_proof",
@@ -609,7 +619,7 @@ describe("Test with mock", () => {
           },
         });
         const res = await rpc.getTransactionProof(TRANSACTION_HASHES);
-        expect(axiosMock.mock.calls[0][0].data).toEqual({
+        expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
           id,
           jsonrpc: "2.0",
           method: "get_transaction_proof",
@@ -652,7 +662,7 @@ describe("Test with mock", () => {
         },
       });
       const res = await rpc.verifyTransactionProof(TRANSACTION_PROOF);
-      expect(axiosMock.mock.calls[0][0].data).toEqual({
+      expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
         id,
         jsonrpc: "2.0",
         method: "verify_transaction_proof",
@@ -716,7 +726,7 @@ describe("Test with mock", () => {
       });
 
       const res = await rpc.getConsensus();
-      expect(axiosMock.mock.calls[0][0].data).toEqual({
+      expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
         id,
         jsonrpc: "2.0",
         method: "get_consensus",
@@ -778,7 +788,7 @@ describe("Test with mock", () => {
         },
       });
       const res = await rpc.getBlockchainInfo();
-      expect(axiosMock.mock.calls[0][0].data).toEqual({
+      expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
         id,
         jsonrpc: "2.0",
         method: "get_blockchain_info",
@@ -822,7 +832,7 @@ describe("Test with mock", () => {
         },
       });
       const res = await rpc.localNodeInfo();
-      expect(axiosMock.mock.calls[0][0].data).toEqual({
+      expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
         id,
         jsonrpc: "2.0",
         method: "local_node_info",
@@ -859,7 +869,7 @@ describe("Test with mock", () => {
         },
       });
       const res = await rpc.getPeers();
-      expect(axiosMock.mock.calls[0][0].data).toEqual({
+      expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
         id,
         jsonrpc: "2.0",
         method: "get_peers",
@@ -877,7 +887,7 @@ describe("Test with mock", () => {
         },
       });
       const res = await rpc.getTipBlockNumber();
-      expect(axiosMock.mock.calls[0][0].data).toEqual({
+      expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
         id,
         jsonrpc: "2.0",
         method: "get_tip_block_number",
@@ -896,7 +906,7 @@ describe("Test with mock", () => {
         },
       });
       const res = await rpc.getBlockHash("0x0");
-      expect(axiosMock.mock.calls[0][0].data).toEqual({
+      expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
         id,
         jsonrpc: "2.0",
         method: "get_block_hash",
@@ -974,7 +984,7 @@ describe("Test with mock", () => {
       });
 
       const res = await rpc.getBlock(BLOCK_HASH);
-      expect(axiosMock.mock.calls[0][0].data).toEqual({
+      expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
         id,
         jsonrpc: "2.0",
         method: "get_block",
@@ -1064,7 +1074,7 @@ describe("Test with mock", () => {
         },
       });
       const res = await rpc.getTipHeader();
-      expect(axiosMock.mock.calls[0][0].data).toEqual({
+      expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
         id,
         jsonrpc: "2.0",
         method: "get_tip_header",
@@ -1139,7 +1149,7 @@ describe("Test with mock", () => {
         },
       });
       const res = await rpc.getTransaction(TX_HASH);
-      expect(axiosMock.mock.calls[0][0].data).toEqual({
+      expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
         id,
         jsonrpc: "2.0",
         method: "get_transaction",
@@ -1218,7 +1228,7 @@ describe("Test with mock", () => {
         },
       });
       const res = await rpc.getLiveCell(OUT_POINT, true);
-      expect(axiosMock.mock.calls[0][0].data).toEqual({
+      expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
         id,
         jsonrpc: "2.0",
         method: "get_live_cell",
@@ -1261,7 +1271,7 @@ describe("Test with mock", () => {
         },
       });
       const res = await rpc.getBannedAddresses();
-      expect(axiosMock.mock.calls[0][0].data).toEqual({
+      expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
         id,
         jsonrpc: "2.0",
         method: "get_banned_addresses",
@@ -1279,7 +1289,7 @@ describe("Test with mock", () => {
         },
       });
       const res = await rpc.clearBannedAddresses();
-      expect(axiosMock.mock.calls[0][0].data).toEqual({
+      expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
         id,
         jsonrpc: "2.0",
         method: "clear_banned_addresses",
@@ -1298,7 +1308,7 @@ describe("Test with mock", () => {
         },
       });
       const res = await rpc.setBan(...PARAMS);
-      expect(axiosMock.mock.calls[0][0].data).toEqual({
+      expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
         id,
         jsonrpc: "2.0",
         method: "set_ban",
@@ -1325,7 +1335,7 @@ describe("Test with mock", () => {
         },
       });
       const res = await rpc.syncState();
-      expect(axiosMock.mock.calls[0][0].data).toEqual({
+      expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
         id,
         jsonrpc: "2.0",
         method: "sync_state",
@@ -1352,7 +1362,7 @@ describe("Test with mock", () => {
         },
       });
       const res = await rpc.setNetworkActive(false);
-      expect(axiosMock.mock.calls[0][0].data).toEqual({
+      expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
         id,
         jsonrpc: "2.0",
         method: "set_network_active",
@@ -1372,7 +1382,7 @@ describe("Test with mock", () => {
       const PEER_ID = "peer id";
       const ADDRESS = "address";
       const res = await rpc.addNode(PEER_ID, ADDRESS);
-      expect(axiosMock.mock.calls[0][0].data).toEqual({
+      expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
         id,
         jsonrpc: "2.0",
         method: "add_node",
@@ -1391,7 +1401,7 @@ describe("Test with mock", () => {
       });
       const PEER_ID = "peer id";
       const res = await rpc.removeNode(PEER_ID);
-      expect(axiosMock.mock.calls[0][0].data).toEqual({
+      expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
         id,
         jsonrpc: "2.0",
         method: "remove_node",
@@ -1409,7 +1419,7 @@ describe("Test with mock", () => {
         },
       });
       const res = await rpc.pingPeers();
-      expect(axiosMock.mock.calls[0][0].data).toEqual({
+      expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
         id,
         jsonrpc: "2.0",
         method: "ping_peers",
@@ -1446,7 +1456,7 @@ describe("Test with mock", () => {
         },
       });
       const res = await rpc.getHeader(BLOCK_HASH);
-      expect(axiosMock.mock.calls[0][0].data).toEqual({
+      expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
         id,
         jsonrpc: "2.0",
         method: "get_header",
@@ -1499,7 +1509,7 @@ describe("Test with mock", () => {
         },
       });
       const res = await rpc.getHeaderByNumber(BLOCK_NUMBER);
-      expect(axiosMock.mock.calls[0][0].data).toEqual({
+      expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
         id,
         jsonrpc: "2.0",
         method: "get_header_by_number",
@@ -1573,7 +1583,7 @@ describe("Test with mock", () => {
         },
       });
       const res = await rpc.sendTransaction(tx, "passthrough");
-      expect(axiosMock.mock.calls[0][0].data).toEqual({
+      expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
         id,
         jsonrpc: "2.0",
         method: "send_transaction",
@@ -2035,7 +2045,7 @@ describe("Test with mock", () => {
           "\n",
           JSON.stringify({ id, jsonrpc: "2.0", ...expectedParams })
         );
-        expect(axiosMock.mock.calls[0][0].data).toEqual({
+        expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
           id,
           jsonrpc: "2.0",
           ...expectedParams,
@@ -2192,7 +2202,7 @@ describe("Test with mock", () => {
           ],
         });
         const res = await batch.exec();
-        expect(axiosMock.mock.calls[0][0].data).toEqual([
+        expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual([
           {
             id,
             jsonrpc: "2.0",

packages/rpc/__tests__/initAxiosWebworkerAdapter.test.js

@@ -1,7 +1,20 @@
-jest.mock('axios')
-const axiosMock = require('axios')
 const {Method} = require('../lib/method')
 
+jest.mock("cross-fetch");
+const axiosMock = require("cross-fetch").default;
+
+beforeAll(() => {
+  const originalResolve = axiosMock.mockResolvedValue;
+  axiosMock.mockResolvedValue = (value) =>
+    originalResolve({
+      json: () => Promise.resolve(value.data),
+    });
+});
+
+afterAll(() => {
+  jest.restoreAllMocks();
+});
+
 describe('Test Method', () => {
   const ranNum = 1
   const id = Math.round(ranNum * 10000)

packages/rpc/__tests__/method.test.js

@@ -0,0 +1,44 @@
+/** mock template start **/
+jest.mock("cross-fetch");
+const axiosMock = require("cross-fetch").default;
+
+const { RPC } = require("../");
+
+beforeAll(() => {
+  const originalResolve = axiosMock.mockResolvedValue;
+  axiosMock.mockResolvedValue = (value) =>
+    originalResolve({
+      json: () => Promise.resolve(value),
+    });
+});
+
+/** mock template end **/
+
+describe("mock cross-fetch", () => {
+  afterEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it("json() should work as expected", async () => {
+    axiosMock.mockResolvedValue({ key: "value" });
+
+    const res = await axiosMock("test-url", {});
+    await expect(res.json()).resolves.toEqual({ key: "value" });
+  });
+
+  it("rpc should work as expected", async () => {
+    const rpc = new RPC("mock-url");
+
+    jest.spyOn(globalThis.Math, "random").mockReturnValue(0.1);
+    axiosMock.mockResolvedValue({ id: 1000, result: "0x1" });
+
+    const blockNumber = await rpc.getTipBlockNumber();
+    expect(JSON.parse(axiosMock.mock.calls[0][1].body)).toEqual({
+      jsonrpc: "2.0",
+      id: 1000,
+      method: "get_tip_block_number",
+      params: [],
+    });
+    expect(blockNumber).toBe("0x1");
+  });
+});

packages/rpc/__tests__/mock.test.js

@@ -20,7 +20,7 @@ describe("rpc", () => {
     try {
       await rpc.getBlockHash("0x01");
     } catch (err) {
-      expect(err.message).toEqual("timeout of 100ms exceeded");
+      expect(err.message).toMatch(/aborted/);
     }
   });
   it("should call rpc successful", async () => {

packages/rpc/__tests__/nock-test/rpc.test.js

@@ -38,9 +38,8 @@
   "dependencies": {
     "@ckb-lumos/base": "0.21.0-next.1",
     "@ckb-lumos/bi": "0.21.0-next.1",
-    "@vespaiach/axios-fetch-adapter": "^0.3.1",
-    "axios": "0.27.2",
-    "tslib": "2.3.1"
+    "abort-controller": "^3.0.0",
+    "cross-fetch": "^3.1.5"
   },
   "devDependencies": {
     "@types/jest": "^29.4.0",

packages/rpc/package.json

@@ -1,23 +1,20 @@
-// import axios from 'axios'
 import { Base } from "./Base";
 import { Method } from "./method";
 import { CKBComponents } from "./types/api";
-
 import { formatter as paramsFormatter } from "./paramsFormatter";
 import * as resultFormatter from "./resultFormatter";
-
 import {
   IdNotMatchedInBatchException,
   MethodInBatchNotFoundException,
   PayloadInBatchException,
 } from "./exceptions";
-import axios from "axios";
 import { RPCConfig } from "./types/common";
-import { initAxiosWebworkerAdapter } from "./initAxiosWebworkerAdapter";
+import fetch from "cross-fetch";
+import { AbortController as CrossAbortController } from "abort-controller";
 
 export const ParamsFormatter = paramsFormatter;
 export const ResultFormatter = resultFormatter;
-initAxiosWebworkerAdapter();
+
 export class CKBRPC extends Base {
   #config: RPCConfig;
   #node: CKBComponents.Node = {
@@ -136,17 +133,24 @@ export class CKBRPC extends Base {
             }
           });
 
-          const batchRes = await axios({
+          const controller = new CrossAbortController() as AbortController;
+          const signal = controller.signal;
+
+          const timeout = setTimeout(
+            () => controller.abort(),
+            ctx.#config.timeout
+          );
+
+          const batchRes = await fetch(ctx.#node.url, {
             method: "POST",
             headers: { "content-type": "application/json" },
-            data: payload,
-            url: ctx.#node.url,
-            httpAgent: ctx.#node.httpAgent,
-            httpsAgent: ctx.#node.httpsAgent,
-            timeout: ctx.#config.timeout,
-          });
+            body: JSON.stringify(payload),
+            signal: signal,
+          }).then((res) => res.json());
+
+          clearTimeout(timeout);
 
-          return batchRes.data.map((res: any, i: number) => {
+          return batchRes.map((res: any, i: number) => {
             if (res.id !== payload[i].id) {
               return new IdNotMatchedInBatchException(i, payload[i].id, res.id);
             }

packages/rpc/src/index.ts

@@ -1,10 +1,9 @@
-import axios from "axios";
 import { IdNotMatchException, ResponseException } from "./exceptions";
-import { initAxiosWebworkerAdapter } from "./initAxiosWebworkerAdapter";
 import { CKBComponents } from "./types/api";
 import { RPCConfig } from "./types/common";
+import fetch from "cross-fetch";
+import { AbortController as CrossAbortController } from "abort-controller";
 
-initAxiosWebworkerAdapter();
 export class Method {
   #name: string;
   #config: RPCConfig;
@@ -40,29 +39,36 @@ export class Method {
   }
 
   /* eslint-disable @typescript-eslint/ban-types, @typescript-eslint/explicit-module-boundary-types */
-  public call = (...params: (string | number | object)[]) => {
+  public call = async (...params: (string | number | object)[]) => {
     const payload = this.getPayload(...params);
-    return axios({
+    const controller = new CrossAbortController() as AbortController;
+    const signal = controller.signal;
+
+    const timeout = setTimeout(() => controller.abort(), this.#config.timeout);
+
+    const res = await fetch(this.#node.url, {
       method: "POST",
       headers: {
         "content-type": "application/json",
       },
-      data: payload,
-      url: this.#node.url,
-      httpAgent: this.#node.httpAgent,
-      httpsAgent: this.#node.httpsAgent,
-      timeout: this.#config.timeout,
-    }).then((res) => {
-      if (res.data.id !== payload.id) {
-        throw new IdNotMatchException(payload.id, res.data.id);
-      }
-      if (res.data.error) {
-        throw new ResponseException(JSON.stringify(res.data.error));
-      }
-      return (
-        this.#options.resultFormatters?.(res.data.result) ?? res.data.result
-      );
-    });
+      body: JSON.stringify(payload),
+      signal,
+    })
+      .then((res) => res.json())
+      .then((res) => {
+        if (res.id !== payload.id) {
+          throw new IdNotMatchException(payload.id, res.id);
+        }
+        if (res.error) {
+          throw new ResponseException(JSON.stringify(res.error));
+        }
+        return (
+          this.#options.resultFormatters?.(res.result) ?? res.result
+        );
+      });
+
+    clearTimeout(timeout);
+    return res;
   };
 
   public getPayload = (...params: (string | number | object)[]) => {

packages/rpc/src/initAxiosWebworkerAdapter.ts

@@ -2,7 +2,7 @@
   "extends": "../../tsconfig.json",
   "compilerOptions": {
     "outDir": "lib",
-    "lib": ["WebWorker"]
+    "lib": ["DOM"]
   },
   "include": ["src"]
 }