TypeError: Failed to parse URL from /api/channels
Answered
Alligator mississippiensis posted this in #help-forum
Alligator mississippiensisOP
My application fails to send request to the api. I don't know what causing this issue.
7 Replies
Alligator mississippiensisOP
⨯ TypeError: Failed to parse URL from /api/channels
at Object.fetch (node:internal/deps/undici/undici:11576:11)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5) {
type: 'TypeError',
page: '/channels/657ffe4567a616da189e9e23'
}this is what the consol says
// app/api/channels/route.ts
import { NextRequest, NextResponse } from "next/server";
import connect from "@/utils/server-helper";
import Channels from "@/models/Channels";
export const GET = async () => {
await connect();
try {
const channels = mergeSort(await Channels.find({}));
return NextResponse.json(channels, { status: 200 });
} catch (err) {
console.log(err);
return NextResponse.json({ error: "Internal Server Error" }, { status: 500 });
}
};
const mergeSort = function(arr: any[]) {
if(arr.length <= 1) return arr; //base case
let middle = Math.floor(arr.length / 2);
let leftArray = arr.slice(0, middle);
let rightArray = arr.slice(middle);
mergeSort(leftArray);
mergeSort(rightArray);
merge(leftArray, rightArray, arr);
return arr;
}
const merge = function(leftArray:any[], rightArray: any[], array: any[]) {
let i = 0, l = 0, r = 0;
while(l < leftArray.length && r < rightArray.length) {
if(leftArray[l].createdAt > rightArray[r].createdAt){
array[i++] = leftArray[l++];
} else {
array[i++] = rightArray[r++];
}
}
while(l < leftArray.length){
array[i++] = leftArray[l++];
}
while(r < rightArray.length) {
array[i++] = rightArray[r++];
}
}this is my route handler
this is how I fetch the API route
import ChannelView from "@/components/client/ChannelView";
import { TChannel } from "@/components/client/ChannelsView";
import { FC } from "react";
export function generateMetadata({params}: {params: PageProps}) {
return {
title: `${params.params.chnl_name}`
}
}
interface PageProps {
params:{
_id: string;
chnl_id: string;
chnl_name: string;
chnl_desc: string;
category: string;
createdAt: Date;
createdBy: string;
}
}
export async function generateStaticParams() {
const res = await fetch("/api/channels",{cache:"no-cache"});
const data: TChannel[] = await res.json();
return data.map((channel) => ({
chnl_id: channel.chnl_id,
chnl_name: channel.chnl_name,
chnl_desc: channel.chnl_desc,
category: channel.category,
createdAt: channel.createdAt,
createdBy: channel.createdBy,
}));
}
const Page: FC<PageProps> = ({params}) => {
return (
<main className="pt-10 w-4/5 min-h-screen">
<section className="flex flex-col mt-15">
<ChannelView params={params}/>
</section>
</main>
);
};
export default Page;Northeast Congo Lion
hi Do you have soluted this problem, and why?
Northeast Congo Lion
@joulev <https://nextjs-faq.com/fetch-api-in-rsc>
Northeast Congo Lion
thankyou