next.js 如何在下一个js13路由处理程序中获取表单数据

z9gpfhce 于 2023-06-05 发布在其他

关注(0)|答案(2)|浏览(238)

我正在使用下一个js 13路由处理程序来获取登录表单数据。我想我应该能够使用formData方法获得它，但它返回一个空对象。我在app/login/page.jsx中的登录页面：

export default function Page() {
    return (
        <div>
            <form action="/api" method="post" className="...">
                <input type="text" name="username" id="username" className="..." />
                <input type="password" name="password" id="username" className="..." />
                <input type="submit" id="submit" value="submit" className="..." />
            </form>
        </div>
    )
}

app/API/route.js：

import { NextResponse } from 'next/server';

export async function POST(request):
    const data = request.formData();
    return NextResposne.json({ data })

这是我提交表格后的回复：

{"data":{}}

有想法吗？谢谢。

next.js

来源：https://stackoverflow.com/questions/76374176/how-to-get-form-data-in-next-js-13-route-handler

2条答案

按热度按时间

hsgswve41#

.formData返回Promise

(method) Body.formData(): Promise<FormData>

你应该等待它：

const data = await request.formData();

赞(0）回复(0）举报 2023-06-05

wqsoz72f2#

您必须从Response创建一个新对象，如果不是，则将其转换为字符串。

import { NextApiRequest, NextApiResponse } from "next";

export async function POST(req: NextApiRequest, res: NextApiResponse) {
const data = await request.formData();
return new Response(JSON.stringify(data))

}

另外，请不要使用ninja code，这不是一个好的编码方式。
请添加另一个安全选项，在不分析输入数据的情况下获取表单数据是非常危险的。

赞(0）回复(0）举报 2023-06-05

我来回答

next.js 如何在下一个js13路由处理程序中获取表单数据

2条答案

相关问题

热门标签

最新问答