Axios 和 Typescript：Return 仅指定道具的数组对象

Question

我正在尝试构建一个 API 来获取我余额中的 ERC20 代币。为此，我将 nextjs 和 axios 与 TypeScript 结合使用。

我遇到的问题是我的端点 returns 输出的响应数据太多，而不是我的 Token 类型中定义的唯一 3 个道具。事情是这样的：

util/api.ts

import axios from 'axios';
import console from 'console';


type Token = {
  contractAddress: string;
  tokenName: string;
  tokenSymbol: string;
};

async function getTokens(walletAddress: string) {
  const params = {
    action: 'tokentx',
    address: walletAddress,
    offset: 5,
    startblock: 0,
    endblock: 999999999,
    sort: 'asc',
    apikey: 'XXXXX'
  }

  try {
    const response = await axios.request<Token[]>({
      url: 'https://api.etherscan.io/api?module=account',
      params: params
    }).then((response) => {
      return response.data
    });

    return response
  } catch (error) {
    if (axios.isAxiosError(error)) {
      console.log('error message: ', error.message);
      return error.message;
    } else {
      console.log('unexpected error: ', error);
      return 'An unexpected error occurred';
    }
  }
}

export async function getWalletBalance(walletAddress: string) {
  let tokens = await getTokens(walletAddress)
  return tokens
}

pages/api/balances/[网络]/[wallet.ts]

import { NextApiRequest, NextApiResponse } from "next";
import NextCors from "nextjs-cors";
import { getWalletBalance } from "../../../../util/api";

export default async (req: NextApiRequest, res: NextApiResponse) => {
  await NextCors(req, res, {
    methods: ["GET"],
    origin: "*",
    optionsSuccessStatus: 200,
  });

  const { wallet } = req.query as { wallet: string };

  try {
    const balance = await getWalletBalance(wallet);
    res.json({ balance });
  } catch (e) {
    res.status(400).json({ error: (e as Error).message });
  }
};

我怎样才能让 getTokens() 只有 returns 一个只有 contractAddress、tokenName、tokenSymbol 道具的 Token 数组，以便端点只输出我需要的 JSON?

Answer 1

如果您希望减少从 api.etherscan.io 返回的数据在你自己的代理中 api 你只需要过滤掉你需要的道具。你可以这样实现：

.then((response) => {
      return response.data.map(x=>({
         contractAddress:x.contractAddress
         tokenName:x.tokenName
         tokenSymbol:x.tokenSymbol
    });
  })

我不太了解第 3 方端点，但我假设它是一个 REST 端点，因此您无法利用 Graphql 通过指定您感兴趣的类型的属性来减少过度获取的能力。

Axios 和 Typescript：Return 仅指定道具的数组对象

Axios & Typescript: Return array object with only the props specified

javascript

typescript

axios

next.js