I have this function in Next.js 13:
async function createTodo(data: FormData) {
"use server";
const title = data.get("title")?.valueOf();
if (typeof title !== "string" || title.length === 0) {
throw new Error("Invalid title");
}
await prisma.todo.create({ data: { title: title, complete: false } });
redirect("/");
}
everything works perfectly until I place the redirect("/");
It shows me the following error:
prisma:query SELECT 1
prisma:query BEGIN
prisma:query INSERT INTO `main`.`Todo` (`id`, `title`, `complete`, `cleatedAt`, `updatedAt`) VALUES (?,?,?,?,?) RETURNING `id` AS `id`
prisma:query SELECT `main`.`Todo`.`id`, `main`.`Todo`.`title`, `main`.`Todo`.`complete`, `main`.`Todo`.`cleatedAt`, `main`.`Todo`.`updatedAt` FROM `main`.`Todo` WHERE `main`.`Todo`.`id` = ? LIMIT ? OFFSET ?
prisma:query COMMIT
failed to get redirect response TypeError: fetch failed
at Object.fetch (/home/jorge/next-13-todo-list/node_modules/next/dist/compiled/undici/index.js:1:26669) {
cause: RequestContentLengthMismatchError: Request body length does not match content-length header
at write (/home/jorge/next-13-todo-list/node_modules/next/dist/compiled/undici/index.js:1:67105)
at _resume (/home/jorge/next-13-todo-list/node_modules/next/dist/compiled/undici/index.js:1:66726)
at resume (/home/jorge/next-13-todo-list/node_modules/next/dist/compiled/undici/index.js:1:65413)
at connect (/home/jorge/next-13-todo-list/node_modules/next/dist/compiled/undici/index.js:1:65301) {
code: 'UND_ERR_REQ_CONTENT_LENGTH_MISMATCH'
}
}
What’s going on?
Despite the error shown in the server console, the application remains alive and functional.
However, when returning to the / route, the result is not refreshed, any suggestions?.
How can I fix it?
2
Answers
The Vercel team has this bug under control in the 13.4.13-canary.11 version.
Let's wait for the upcoming stable version.
Do you what more info?, check my ticket: https://github.com/vercel/next.js/issues/53392
Is it server actions enabled on nextjsConfig ?
module.exports = {
experimental: {
serverActions: true,
},
};