如何使用API路由获取区块链数据？

Question

我正在学习一个教程，他使用 axios 来获取数据。但现在 axios 端点无法工作（出现服务器错误）

所以，想知道如何在我的项目中使用 Nextjs api 路由而不是 axios。

如果您能指导我并帮助我解决这个问题，那将非常有帮助

也出现了一些错误：

Argument of type 'Actions' is not assignable to parameter of type 'MetaMaskConstructorArgs'. Property 'actions' is missing in type 'Actions' but required in type 'MetaMaskConstructorArgs'

Landing.tsx

-> “string”类型的参数不可分配给“never”类型的参数

AddTaskPopup.tsx

-> 输入 '{ value: string;标签：字符串； }[]' 不可分配给类型“readonly GroupBase[]”。 类型“{ value: string;”中缺少属性“options”标签：字符串； }'，但在“GroupBase”类型中是必需的。

项目仓库如 -> https://github.com/akashpanda122/gig-board-demo

Answer 1

Next.js 路由是在项目中构建后端端点的好方法。以下是有关如何执行此操作的简单概述：

1. 创建 API 路由

在您的页面目录中，创建一个 api 目录。您在此 api 目录中创建的每个文件都将是一个 API 路由。例如，如果您在 api 目录中创建文件 hello.js，则可以通过 http://localhost:3000/api/hello 访问它。这是一个例子：

export default function handler(req, res) {
    res.status(200).json({ text: 'Hello' });
}

2. 从组件/页面中的 API 路径获取数据：

   您可以使用浏览器内置的 fetch 方法来调用您的 API 路由。例如，从上述 API 路径获取数据：

   fetch('/api/hello') .then(响应=>response.json()) .then(data => console.log(data));

这应该是创建 API 端点的坚实起点。如果您还有其他问题请告诉我！