在 Next.js 14 项目中,获取 fetch 请求的响应参数

1、使用 await 获取 fetch 请求的响应。

2、解析响应以获取 JSON 数据。

下面是一个示例代码,展示了如何获取和处理响应参数:

javascript 复制代码
import { NextResponse } from 'next/server';

export default async function handler(req) {
  const dataToSend = {
    // 你的数据
  };

  try {
    const response = await fetch(`${req.nextUrl.origin}/api/import`, {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json',
      },
      body: JSON.stringify(dataToSend), // 将数据转换为 JSON 字符串
    });

    if (!response.ok) {
      // 处理错误响应
      console.error('HTTP error', response.status);
      return NextResponse.json({ error: 'Failed to fetch data' }, { status: response.status });
    }

    const responseData = await response.json(); // 解析 JSON 数据

    // 处理 responseData
    console.log('Response Data:', responseData);

    return NextResponse.json(responseData); // 返回解析后的数据
  } catch (error) {
    // 处理 fetch 过程中可能出现的错误
    console.error('Fetch error:', error);
    return NextResponse.json({ error: 'Fetch error' }, { status: 500 });
  }
}
相关推荐
星火开发设计5 小时前
C++ 数组:一维数组的定义、遍历与常见操作
java·开发语言·数据结构·c++·学习·数组·知识
TTGGGFF6 小时前
控制系统建模仿真(一):掌握控制系统设计的 MAD 流程与 MATLAB 基础运算
开发语言·matlab
2501_944424126 小时前
Flutter for OpenHarmony游戏集合App实战之贪吃蛇食物生成
android·开发语言·flutter·游戏·harmonyos
利刃大大7 小时前
【Vue】Vue2 和 Vue3 的区别
前端·javascript·vue.js
Lhuu(重开版7 小时前
JS:正则表达式和作用域
开发语言·javascript·正则表达式
仙俊红7 小时前
Java Map 家族核心解析
java·开发语言
浅念-7 小时前
C语言小知识——指针(3)
c语言·开发语言·c++·经验分享·笔记·学习·算法
code_li8 小时前
聊聊支付宝架构
java·开发语言·架构
yuguo.im8 小时前
我开源了一个 GrapesJS 插件
前端·javascript·开源·grapesjs
安且惜8 小时前
带弹窗的页面--以表格形式展示
前端·javascript·vue.js