T
TanStack•6mo ago
fair-rose

api routes GET returning 404

so im creating new project using Basic + Clerk Auth from docs, after that im tryin to add api /api/getAllCCTV this is the code 
import { PrismaClient } from "@prisma/client";
import { json } from "@tanstack/react-start";
import { createAPIFileRoute } from "@tanstack/react-start/api";

const prisma = new PrismaClient();

export const APIRoute = createAPIFileRoute("/api/getAllCCTV")({
  GET: async ({ request, params }) => {
    console.log("getAllCCTV");
    const categories = await prisma.category.findMany({
      include: {
        CCTV_Data: true,
      },
      orderBy: [{ updatedAt: "desc" }, { createdAt: "desc" }],
    });

    // Filter categories to include only those with more than 1 dataCCTV
    const filteredCategories = categories.filter(
      (category) => category.CCTV_Data.length > 1
    );

    // Transform dataCCTV items to include stream URL
    const updatedCategories = filteredCategories.map((category) => ({
      ...category,
      dataCCTV: category.CCTV_Data.map((cctv) => ({
        ...cctv,
        streamURL: `${import.meta.env.VITE_PUBLIC_CCTV_STREAM_URL}/${
          cctv.cctvId
        }/index.m3u8`, // Replace with your logic to generate the stream URL
      })),
    }));

    return json({
      data: updatedCategories,
    });
  },
});
import { PrismaClient } from "@prisma/client";
import { json } from "@tanstack/react-start";
import { createAPIFileRoute } from "@tanstack/react-start/api";

const prisma = new PrismaClient();

export const APIRoute = createAPIFileRoute("/api/getAllCCTV")({
  GET: async ({ request, params }) => {
    console.log("getAllCCTV");
    const categories = await prisma.category.findMany({
      include: {
        CCTV_Data: true,
      },
      orderBy: [{ updatedAt: "desc" }, { createdAt: "desc" }],
    });

    // Filter categories to include only those with more than 1 dataCCTV
    const filteredCategories = categories.filter(
      (category) => category.CCTV_Data.length > 1
    );

    // Transform dataCCTV items to include stream URL
    const updatedCategories = filteredCategories.map((category) => ({
      ...category,
      dataCCTV: category.CCTV_Data.map((cctv) => ({
        ...cctv,
        streamURL: `${import.meta.env.VITE_PUBLIC_CCTV_STREAM_URL}/${
          cctv.cctvId
        }/index.m3u8`, // Replace with your logic to generate the stream URL
      })),
    }));

    return json({
      data: updatedCategories,
    });
  },
});
when i try to access from browser, i got error 404, i see on the log it said like this ServerFn Request: src_routes_root_tsx--fetchClerkAuth_createServerFn_handler, ServerFn Response: 200 whats wrong with it ? do i need to exclude /api on beforeLoad at _root.tsx ?
1 Reply
flat-fuchsia
flat-fuchsia•6mo ago
can you please provide a complete minimal example?

Did you find this page helpful?