如何使用查询字符串在 Next.js 中创建 API 端点

Bas*_*has 17 javascript query-string reactjs next.js

我需要使用 Next.js 创建以下 API 端点:

/api/products/[name]?keyword=${anykeyword}

我知道我需要在index.js 中的pages/api/products/[name] 目录中创建它。但我怎样才能访问keyword.

req.query仅包含name.

以下是我的代码:

import { connectToDatabase } from "../../../../util/mongodb";
import validate from "../../../../validation/product";
//capitalize first letter only to avoid errors
import capitalize from "lodash.capitalize";

export default async function productsHandler(req, res) {
const {
  query: { name, keyword }, // here i cannot access keyword//
  method,
} = req,
Name = capitalize(name),
{ db } = await connectToDatabase(),
searchCriteria = keyword ? keyword : "price";

switch (method) {
case "GET":
  // @route GET api/products/[name]
  // @desc get products of [name] from data base
  // @access public
  {
    const products = await db
      .collection("products")
      .find({ category: Name })
      .sort({ [searchCriteria]: 1 })
      .toArray();

    if (!products.length)
      return res.status(404).json({ error: "no such category" });

    res.status(200).json(products);
  }

  break;
Run Code Online (Sandbox Code Playgroud)

mah*_*mun 15

这可能与请求从客户端发送到服务器端的方式有关。您可能需要修改它。我刚刚使用 Postman 尝试了该示例,它正确解析了参数:

import { NextApiRequest, NextApiResponse } from "next";

export default async (request: NextApiRequest, response: NextApiResponse) => {
  const {
    query: { name, keyword },
    method,
  } = request;
  console.log(name, keyword, method);

  // do nothing fancy and simply return a string concatenation
  return response.status(200).json({ query: name + " " + keyword });
};

Run Code Online (Sandbox Code Playgroud)

邮差:

在此输入图像描述


the*_*rwl 9

要获取搜索参数,您只需使用req.nextUrl.serachParams.get("keyword")

async function GET(req:NextRequest){
 console.log(req.nextUrl.searchParams.get("keyword"))
}
Run Code Online (Sandbox Code Playgroud)