如何在部署环境中使用nextjs API路由?

bcs8qyzn  于 2023-04-30  发布在  其他
关注(0)|答案(1)|浏览(102)

我的nextjs版本-13.2.1
首先,下面的代码在本地环境中可以正常工作。

// src/pages/api/md/index.ts
// get markdowns data

import type { NextApiRequest, NextApiResponse } from "next";
import { join } from "path";
import fs from "fs/promises";
import matter from "gray-matter";
import { MarkDownProps } from "@/types/pages";

type Error = {
  error: string;
};

type Data = MarkDownProps[] | Error;

type Send<Data> = (data: MarkDownProps[]) => void;

type newApiResponse = {
  send: Send<Data>;
  json: Send<Data>;
  status: (statusCode: number) => NextApiResponse<Data>;
};

export default async function handler(
  req: NextApiRequest,
  res: newApiResponse,
) {
  if (req.method === "GET") {
    try {
      const result = await getMdList();
      res.status(200).send(result);
    } catch (error) {
      res.status(500).send({ error: "failed to fetch data" });
    }
  }
}

export const getMdList = async () => {
  ...some code
  return posts;
};

async function getMdFiles(dirPath: string): Promise<string[]> {
  ...some code
  return mdFiles;
}
// Components that use the API
// get markdowns data

const listfetch = async () => {
    const response = await axios.get("/api/md");
    if (pathname.split("/")[1] === "blog") {
      setRecommandList(
        response.data.filter(
          (item: MarkDownProps) => item.category === "github",
        ),
      );
    } else {
      setRecommandList(
        response.data.filter(
          (item: MarkDownProps) => item.category === pathname.split("/")[1],
        ),
      );
    }
  };

  useEffect(() => {
    listfetch();
  }, []);

该代码在本地很好地接收数据。但在部署中未找到
错误:GET https://{我的URL}/API/md 404
想想这需要什么,我在接下来添加了pageExtensions。配置但不工作太
我的配置是

/** @type {import('next').NextConfig} */
const nextConfig = {
  reactStrictMode: false,
  images: {
    unoptimized: true,
  },
  compiler: {
    styledComponents: true,
  },
  pageExtensions: ["js", "jsx", "ts", "tsx", "md", "mdx"],
};

module.exports = nextConfig;

这个问题怎么解决??

gdx19jrr

gdx19jrr1#

无法在静态部署环境中使用页面/API目录

相关问题