我在将我的电子商务 Nextjs13 应用程序部署到 Vercel 时遇到了问题。应用程序在本地环境中运行良好,但在托管时出现了以下错误。
Error in getting all categories: DynamicServerError: Dynamic server usage: headers
at staticGenerationBailout (/vercel/path0/.next/server/chunks/536.js:181:21)
at Object.headers (/vercel/path0/.next/server/chunks/616.js:201:62)
at handleReqBailout (/vercel/path0/.next/server/chunks/616.js:3048:35)
at Object.get (/vercel/path0/.next/server/chunks/616.js:3068:13)
at AuthCheck (/vercel/path0/.next/server/app/api/Admin/category/delete-category/route.js:237:23)
at GET (/vercel/path0/.next/server/app/api/Admin/category/getCategory/route.js:164:67)
at async /vercel/path0/.next/server/chunks/616.js:3352:37 {
digest: 'DYNAMIC_SERVER_USAGE'
}
这是我正在做的事情,
我有一个仪表板页面,在那里我获取所有类别数据并将其设置在redux存储中,然后在子组件中获取该数据并在数据表中显示它。
这是我的代码
/api/Admin/category/getCategory
import connectDB from "@/DB/connectDB";
import AuthCheck from "@/middleware/AuthCheck";
import { NextResponse } from "next/server";
import Category from "@/model/Category";
export async function GET(req: Request) {
try {
await connectDB();
const isAuthenticated = await AuthCheck(req);
if (isAuthenticated) {
const getData = await Category.find({});
if (getData) {
return NextResponse.json({success :true , data : getData});
} else {
return NextResponse.json({status: 204 , success: false, message: 'No categories found.' });
}
} else {
return NextResponse.json({status: 401 , success: false, message: "You are not authorized." });
}
} catch (error) {
console.log('Error in getting all categories:', error);
return NextResponse.json({status : 500 , success: false, message: 'Something went wrong. Please try again!' });
}
}
管理后台页面
"use client"
import Cookies from 'js-cookie'
import { useRouter } from 'next/navigation'
import React, { useEffect } from 'react'
import AdminNavbar from '@/components/AdminNavbar';
import AdminSidebar from '@/components/AdminSidebar';
import SuperComponent from '@/components/SuperComponent';
import { ToastContainer, toast } from 'react-toastify';
import useSWR from 'swr'
import { get_all_categories } from '@/Services/Admin/category';
import { useDispatch } from 'react-redux';
import { setCatLoading, setCategoryData } from '@/utils/AdminSlice';
interface userData {
email: String,
role: String,
_id: String,
name: String
}
export default function Dashboard() {
const Router = useRouter();
const dispatch = useDispatch();
useEffect(() => {
const user: userData | null = JSON.parse(localStorage.getItem('user') || '{}');
if (!Cookies.get('token') || user?.role !== 'admin') {
Router.push('/')
}
}, [])
const { data : categoryData , isLoading : categoryLoading } = useSWR('/gettingAllCategoriesFOrAdmin', get_all_categories)
if (categoryData?.success !== true) toast.error(categoryData?.message)
useEffect(() => {
dispatch(setCategoryData(categoryData?.data))
dispatch(setCatLoading(categoryLoading))
}, [categoryData , dispatch , categoryLoading])
return (
<div className='w-full h-screen flex bg-base-200 overflow-hidden'>
<AdminSidebar />
<div className='w-full h-full '>
<AdminNavbar />
<div className='w-full h-5/6 flex flex-wrap items-start justify-center overflow-y-auto px-4 py-2'>
<SuperComponent />
</div>
</div>
<ToastContainer />
</div>
)
}