-
Notifications
You must be signed in to change notification settings - Fork 63
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Nextjs routes #227
Comments
What problems are you facing? |
So... Next-connect, The example provided looks like it is used in "one file" Example with nextjs-13: https://github.com/hoangvvo/next-connect/blob/main/examples/nextjs-13/src/app/api/users/route.ts But the beauty of next-connect seems to be it can be defined as a "centralized hub" for api routes. In "Pages" app shown here you can create a wrapper with next-connect /api/shows/index.ts const handler = createHandler();
handler.get(async (req: NextApiRequest, res: NextApiResponse) => {
let shows = await getShows();
// generate shows if there aren't any
if (shows.length === 0) {
await generateData();
shows = await getShows();
}
return res.status(200).json({ shows });
}); createHandler is stored in a api/handler file. import type { NextApiRequest, NextApiResponse } from "next";
import nextConnect from "next-connect";
import { validateToken } from "@/lib/auth/utils";
import { processApiError } from "./utils";
// base handler for centralized error and method handling
export const createHandler = ({
authRequired,
}: { authRequired?: boolean } = {}) => {
const handler = nextConnect({
onError(error, req: NextApiRequest, res: NextApiResponse) {
const { status, message } = processApiError(error);
res.status(status).json({ message });
},
onNoMatch(req: NextApiRequest, res: NextApiResponse) {
res.status(405).end(`Method ${req.method} Not Allowed`);
},
});
if (authRequired) {
handler.use(async (req, res, next) => {
const tokenIsValid = await validateToken(req);
if (!tokenIsValid) return res.status(401).end();
return next();
});
}
return handler;
}; With this setup. We don't need to add useSession in every page.tsx file. It can be handled during api call as well. // As example an reservation page - requires authenticated calls My own attempt of doing in "app": import { NextFetchEvent, NextRequest, NextResponse } from "next/server";
import { createEdgeRouter } from "next-connect";
import { validateToken } from "@/lib/auth/utils";
import { processApiError } from "./utils";
// base handler for centralized error and method handling
export const createHandler = ({
authRequired,
}: { authRequired?: boolean } = {}) => {
const handler = createEdgeRouter<NextRequest, NextFetchEvent>();
handler.handler({
onError(error, req, res) {
const { status, message } = processApiError(error);
NextResponse.json( { message },{ status });
},
onNoMatch(req, res) {
NextResponse.json(`Method ${req.method} Not Allowed`);
},
});
if (authRequired) {
handler.use(async (req, res, next) => {
const tokenIsValid = await validateToken(req, req.nextUrl.searchParams.get("userId"));
if (!tokenIsValid) return NextResponse.json({status: 401});
return next();
});
}
return handler;
}; Used in route.ts /api/shows/ as: export async function GET(req: Request) {
return handler.get(async (req: Request) => {
let shows = await getShows();
// generate shows if there aren't any
if (shows.length === 0) {
await generateData();
shows = await getShows();
}
return NextResponse.json({ shows });
});
} But I don't get it working yet because I think nextConnect wrapper is used in handler.ts EDIT:
In new one it alittle different.
One thing that gets me , most of times, is people built perfect libraries but then when it refactored many use-cases in the old ones are lost for "faster" way of writing. Having a page with "old code" - for this scenario. Here's the exact same scenario but with using new version. |
not working with nextjs 13 app directory api
i have trieded many times
The text was updated successfully, but these errors were encountered: