I really need your support.

I’m creating next.js app with mongodb and deployed to vercel.
but not working app/api/ to get the data of mongodb.
https://vercel.app/api/ is displayed 404 not found…
other page working.
only app/api not working.

this is my code↓
app/api/user/route.ts

import { NextRequest, NextResponse } from "next/server";
import { connectDb } from "@/utils/database";
import { UserModel } from "@/models/userModel";

export const GET = async (request: NextRequest) => {
  try {
    await connectDb();

    const { searchParams } = new URL(request.url);
    const name = searchParams.get("name");

    if (!name) {
      return NextResponse.json(
        { message: "400" },
        { status: 400 }
      );
    }

    const user = await UserModel.findOne({ name });

    if (user) {
      return NextResponse.json({
        message: "successful",
        user: user,
      });
    } else {
      return NextResponse.json(
        { message: "404" },
        { status: 404 }
      );
    }
  } catch (error) {
    return NextResponse.json(
      { message: "500 },
      { status: 500 }
    );
  }
};

utils/database.ts

import mongoose from "mongoose";

export const connectDb = async () => {
  try {
    const url = process.env.MONGODB_URI;
    if (!url) {
      throw new Error();
    }
    await mongoose.connect(url);
  } catch (error) {
    throw new Error();
  }
};

models/userModel.ts

import { PortOfSpeech } from "@/types/types";
import mongoose, { Document, Schema } from "mongoose";

export interface WordData {
  word_id: string;
  word: string;
  wordMeaning: string;
  sentence: string;
  sentenceMeaning: string;
  portOfSpeech: PortOfSpeech[];
  isCompleted: boolean;
}

export interface User {
  name: string;
  password: string;
  level600_data: WordData[];
  level730_data: WordData[];
  level860_data: WordData[];
  level990_data: WordData[];
}

export interface UserDocument extends User, Document {
  _id: string;
}

const userSchema = new Schema<UserDocument>(
  {
    name: {
      type: String,
      required: true,
    },
    password: {
      type: String,
      required: true,
    },
    level600_data: {
      type: [
        {
          word_id: String,
          word: String,
          wordMeaning: String,
          sentence: String,
          sentenceMeaning: String,
          portOfSpeech: [String],
          isCompleted: Boolean,
        },
      ],
      default: [],
    },
    level730_data: {
      type: [
        {
          word_id: String,
          word: String,
          wordMeaning: String,
          sentence: String,
          sentenceMeaning: String,
          portOfSpeech: [String],
          isCompleted: Boolean,
        },
      ],
      default: [],
    },
    level860_data: {
      type: [
        {
          word_id: String,
          word: String,
          wordMeaning: String,
          sentence: String,
          sentenceMeaning: String,
          portOfSpeech: [String],
          isCompleted: Boolean,
        },
      ],
      default: [],
    },
    level990_data: {
      type: [
        {
          word_id: String,
          word: String,
          wordMeaning: String,
          sentence: String,
          sentenceMeaning: String,
          portOfSpeech: [String],
          isCompleted: Boolean,
        },
      ],
      default: [],
    },
  },
  { collection: "user_data" }
);

export const UserModel =
  mongoose.models.User || mongoose.model<UserDocument>("User", userSchema);

.env

MONGODB_URI=my mongodb uri

NEXT_PUBLIC_API_URL=http://localhost:3000/api

Environment Variables　is set to vercel.↓
enter image description here

but not working…..
enter image description here
enter image description here

I don’t know how to resolve it…
Could you tell me how to fix it….🙏