throw redirect() not working in loader.
I wanted to add a redirect to the right url if some tried to use sany invalid url for.
but some how it's not working as it suppose to. Not redirecting nor rendering anything for invalid page aswell!!!
Any idea?
2 Replies
extended-salmonOP•4mo ago
beforeLoad: async ({ params }) => {
const newSlugSplit = params.slug.split("-");
const lastSegment = newSlugSplit[newSlugSplit.length - 1];
const imageID = parseInt(lastSegment.toString());
if (isNaN(imageID)) {
throw notFound();
}
return {
imageID: imageID,
};
}
beforeLoad: async ({ params }) => {
const newSlugSplit = params.slug.split("-");
const lastSegment = newSlugSplit[newSlugSplit.length - 1];
const imageID = parseInt(lastSegment.toString());
if (isNaN(imageID)) {
throw notFound();
}
return {
imageID: imageID,
};
}
loader: async ({ context, params }) => {
const imageID = context.imageID;
const newSlugSplit = params.slug.split("-");
const categories = newSlugSplit.slice(0, -1);
try {
const queryOption = context.trpc.images.byId.queryOptions({
id: imageID,
});
const imageData = await context.queryClient.fetchQuery({
...queryOption,
});
if (!imageData) {
return {
imageID: imageID,
categories: categories,
imageData: null,
similarImages: [],
};
}
let isRightUri = true;
const catArr = getCategoryArray(imageData.categories ?? "")
.map((cat) => cat.toLowerCase().replace(" (18+)", ""))
.join(" ")
.replaceAll("-", " ")
.split(" ");
catArr.forEach((cat) => {
if (!categories.includes(cat)) {
isRightUri = false;
}
});
if (!isRightUri) {
throw redirect({
statusCode: 301,
replace: true,
to: "/i/$slug",
params: {
slug: getImagePagePath({
categories: imageData.categories ?? "",
imageId: imageData.id.toString(),
}),
},
reloadDocument: true,
});
}
const { images: similarImagesData } =
await context.queryClient.fetchQuery(
context.trpc.images.SimilarImages.queryOptions({
category: env.VITE_CATEGORY,
})
);
return {
imageID: imageID,
categories: categories,
imageData: { ...filterImagePath(imageData), imageSpintax },
similarImages: similarImagesData,
};
} catch (error) {
if (error instanceof TRPCClientError) {
if (error.data.code === "NOT_FOUND" || error.data.httpStatus === 404) {
throw notFound();
}
}
throw error;
}
},
loader: async ({ context, params }) => {
const imageID = context.imageID;
const newSlugSplit = params.slug.split("-");
const categories = newSlugSplit.slice(0, -1);
try {
const queryOption = context.trpc.images.byId.queryOptions({
id: imageID,
});
const imageData = await context.queryClient.fetchQuery({
...queryOption,
});
if (!imageData) {
return {
imageID: imageID,
categories: categories,
imageData: null,
similarImages: [],
};
}
let isRightUri = true;
const catArr = getCategoryArray(imageData.categories ?? "")
.map((cat) => cat.toLowerCase().replace(" (18+)", ""))
.join(" ")
.replaceAll("-", " ")
.split(" ");
catArr.forEach((cat) => {
if (!categories.includes(cat)) {
isRightUri = false;
}
});
if (!isRightUri) {
throw redirect({
statusCode: 301,
replace: true,
to: "/i/$slug",
params: {
slug: getImagePagePath({
categories: imageData.categories ?? "",
imageId: imageData.id.toString(),
}),
},
reloadDocument: true,
});
}
const { images: similarImagesData } =
await context.queryClient.fetchQuery(
context.trpc.images.SimilarImages.queryOptions({
category: env.VITE_CATEGORY,
})
);
return {
imageID: imageID,
categories: categories,
imageData: { ...filterImagePath(imageData), imageSpintax },
similarImages: similarImagesData,
};
} catch (error) {
if (error instanceof TRPCClientError) {
if (error.data.code === "NOT_FOUND" || error.data.httpStatus === 404) {
throw notFound();
}
}
throw error;
}
},
plain-purple•4mo ago
a complete reproducer would be necessary here