我正在处理一个使用next.js中的auth.js进行用户身份验证的项目.我想有一个API,从MongoDB数据库中获取关于用户的特定信息. 该站点通过next.js中的中间件进行保护.如果我在登录后直接访问URL(本地主机:3000/api/Project),我的API就可以工作. 然而,当我try 获取数据时,我得到了一个错误Error: Unexpected token '<', "<!DOCTYPE "... is not valid JSON,因此似乎有一个重定向到了某个地方,但我找不到原因.
这是我的api/Projects/route.js

import { connectDB } from "../../../utils/database";
import { NextResponse } from "next/server";
import Project from "../../(models)/Project";
import { getServerSession } from "next-auth";
import { options } from "../../api/auth/[...nextauth]/options";

export const GET = async (req, res) => {
  const session = await getServerSession(options);

  try {
    await connectDB();
    const fetchedProjects = await Project.find({
      userID: session.user.id,
    }).exec();

    return new NextResponse(JSON.stringify(fetchedProjects), { status: 200 });
  } catch (error) {
    return new NextResponse("Error in fetching data" + error, { status: 500 });
  }
};

这是我的app/projects/page.js中的API FETCH

async function getProjects() {
  try {
    console.log("FETCHING DOCUMENTS");
    const res = await fetch("http://localhost:3000/api/Projects", {
      cache: "no-store",
    });
    if (!res.ok) return notFound();
    console.log(res);
    return res.json();
  } catch (error) {
    console.log(error);
  }
};

If I bypass all my authentication and just fetch all entries from the database in my API this code works. With the authentication in place fetch returns the following (taken from the console): console screenshot

推荐答案

我想这是因为在您登录浏览器后,一些会话会被存储并与您的请求一起发送.但是,在您的服务器组件中,情况并非如此.

从服务器组件获取内部API路由无论如何都是一件坏事.因为它已经在服务器上运行,所以直接从数据库中获取数据.否则,你很可能会得到TypeError: fetch failed during Next.js project build分.

此外,来自Vercel的Lee Robinson解释说,在这段名为10 common mistakes with the Next.js App Router的视频中.

Javascript相关问答推荐

简单的PayPal按钮集成导致404错误

为什么useState触发具有相同值的呈现

使用Java脚本导入gltf场景并创建边界框

WhatsApp Cloud API上载问题:由于MIME类型不正确而导致接收&Quot;INVALID_REQUEST";错误

从Nextjs中的 Select 项收集值,但当单击以处理时,未发生任何情况

使用VUE和SCSS的数字滚动动画(&;内容生成)

在开发期间,Web浏览器如何运行&qot;.jsx&qot;文件?

当我在Reaction中创建一个输入列表时,我的输入行为异常

如何在 Select 文本时停止Click事件?

AddEventListner,按键事件不工作

更新Redux存储中的对象数组

警告框不显示包含HTML输入字段的总和

react 路由如何使用从加载器返回的数据

使用VITE开发服务器处理错误

在HTML中使用meta标记来指定定制元数据以用于使用JavaScript进行检索是不是一个坏主意?

如何使用useparams从react路由中提取id

将匿名函数附加到链接的onClick属性

递归地将JSON对象的内容上移一级

Reaction路由v6.4+数据API:重试加载程序而不显示错误

如何调用多个$HTTP.POST请求?