Response from Server Actions
Answered
Asiatic Lion posted this in #help-forum
Asiatic LionOP
in server component im calling server action that creates new entry in database. How can I redirect user to new url with id returned from server action?
19 Replies
you can use redirect function inside of the server action
https://nextjs.org/docs/app/api-reference/functions/redirect
https://nextjs.org/docs/app/api-reference/functions/redirect
@chisto you can use redirect function inside of the server action
https://nextjs.org/docs/app/api-reference/functions/redirect
Asiatic LionOP
hey, I didn't see your response, but I came up with same solution. Now only problem is that redirect throws an error. On documentation it says it is normal (at least I understand it like that). How could I stop this error from flooding my console?
which error you get?
Asiatic LionOP
the redirect has to be outside of the try catch
Asiatic LionOP
export async function GenerateWeb(formData: FormData) {
const description = formData.get("description") || "NaN" as string;
const name = formData.get("name") || "NaN" as string;
const ticker = formData.get("ticker") || "NaN";
const contractAddress = formData.get("contractAddress") || "NaN";
console.log("Generating website for contract: ", contractAddress);
await prisma.website.create({
data: {
name,
description,
url: contractAddress
},
}).then(res => {
console.log(res.id);
redirect(`/web/${res.id}`);
}).catch(err => {
console.log(err);
throw err;
})
// return { sucess: true}
}Asiatic LionOP
nevermind
Answer
Asiatic LionOP
works
yay
Asiatic LionOP
thank you so much
tbh I didn't consider
.then as try catchmy bad
can you mark it as solved?
Asiatic LionOP
yeah
thanks again
@Asiatic Lion ts
export async function GenerateWeb(formData: FormData) {
const description = formData.get("description") || "NaN" as string;
const name = formData.get("name") || "NaN" as string;
const ticker = formData.get("ticker") || "NaN";
const contractAddress = formData.get("contractAddress") || "NaN";
console.log("Generating website for contract: ", contractAddress);
await prisma.website.create({
data: {
name,
description,
url: contractAddress
},
}).then(res => {
console.log(res.id);
redirect(`/web/${res.id}`);
}).catch(err => {
console.log(err);
throw err;
})
// return { sucess: true}
}
Kurilian Bobtail
move your catch handler above
then, so you only get errors from your actual logic, and not NEXT_REDIRECT which is internal mechanism@Kurilian Bobtail move your catch handler above `then`, so you only get errors from your actual logic, and not `NEXT_REDIRECT` which is internal mechanism
Asiatic LionOP
'use server';
import prisma from "@/lib/db";
import { redirect } from "next/navigation";
export async function GenerateWeb(formData: FormData) {
const description = formData.get("description") || "NaN" as string;
const name = formData.get("name") || "NaN" as string;
const ticker = formData.get("ticker") || "NaN";
const contractAddress = formData.get("contractAddress") || "NaN";
console.log("Generating website for contract: ", contractAddress);
const website = await prisma.website.create({
data: {
name,
description,
url: contractAddress
},
}).catch((error) => {
console.log(error);
});
redirect(`/web/${website.id}`);
}is it okay? I mean it works, but is it done corectly?
Kurilian Bobtail
almost, except for one thing: in your previous code you logged the error and threw it again. you need that in your case