refactor: migrate axios to fetch

[homura]

Description

Fixes #487

This pull request updates the @ckb-lumos/rpc library to use fetch instead of axios. This change was made to avoid modifying axios's adapter, which could potentially cause issues. By choosing a dependency without the state, Lumos can function better as a library. The fetch is not stateful, and it's widely supported in several runtimes, including the modern browsers, NodeJS, Deno, and Bun

Recently, a project using Axios and Lumos together experienced build failures, resulting in an error message that reads:

ERROR in ./node_modules/@vespaiach/axios-fetch-adapter/index.js 2:0-43
Module not found: Error: Package path ./lib/core/settle is not exported from package 

This error was caused by

lumos/packages/rpc/src/initAxiosWebworkerAdapter.ts

Lines 15 to 16 in a243f11

	/* istanbul ignore next */ const fetchAdapter = require("@vespaiach/axios-fetch-adapter");
	/* istanbul ignore next */ axios.defaults.adapter = fetchAdapter.default;

You may notice the httpAgent and httpsAgent were removed from the creation of axios in this pull request, but don't worry, they have never been used in Lumos

lumos/packages/rpc/src/index.ts

Lines 23 to 25 in a243f11

	#node: CKBComponents.Node = {
	url: "",
	};

Type of change

Please delete options that are not relevant.

• Bug fix (non-breaking change which fixes an issue)
• Refactor (non-breaking change)

How Has This Been Tested?

• unit test

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated (UTC)
lumos-website	✅ Ready (Inspect)	Visit Preview	Nov 8, 2023 2:12pm

[codecov]

Codecov Report

Merging #564 (9fc2d67) into develop (a243f11) will increase coverage by 0.04%.
The diff coverage is 80.00%.

@@             Coverage Diff             @@
##           develop     #564      +/-   ##
===========================================
+ Coverage    86.96%   87.00%   +0.04%     
===========================================
  Files          115      114       -1     
  Lines        23102    23094       -8     
  Branches      2358     2352       -6     
===========================================
+ Hits         20091    20094       +3     
+ Misses        2967     2956      -11     
  Partials        44       44              

Files	Coverage Δ
packages/rpc/src/method.ts	86.81% <88.88%> (+7.98%)	⬆️
packages/rpc/src/index.ts	74.43% <66.66%> (-0.57%)	⬇️

---

Continue to review full report in Codecov by Sentry.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update a243f11...9fc2d67. Read the comment docs.

[zhangyouxin]

Looks like this PR also resolves axios adapter problem when making some http(s) API calls in chrome extension environment also?

[homura]

Looks like this PR also resolves axios adapter problem when making some http(s) API calls in chrome extension environment also?

you're right, it also works well in ServiceWorker

[homura]

You may notice the httpAgent and httpsAgent were removed from the creation of axios in this pull request, but don't worry, they have never been used in Lumos

lumos/packages/rpc/src/index.ts

Lines 23 to 25 in a243f11

	#node: CKBComponents.Node = {
	url: "",
	};

I suddenly realized it is wrong, the http(s)Agent may be passed through setNode

lumos/packages/rpc/src/index.ts

Lines 66 to 69 in 68e4f5b

	public setNode(node: CKBComponents.Node): CKBComponents.Node {
	Object.assign(this.node, node);
	return this.node;
	}

so that we still need to support the http(s)Agent. To support the agent, Lumos should make the fetch customizable, like this

// example for working with keepalive
const customizedFetch: typeof fetch = (request, init) => {
  return globalThis.fetch(request, {
    ...init,
    keepalive: true,
  });
};


const rpc = new RPC(url, { fetch: customizedFetch })

// or if you are still working with NodeJS
import fetch from 'node-fetch'

new PRC(url, {
  fetch: (request, init) => {
    return fetch(request, { ...init, agent: customAgent })
  }
})