I have some experience of python flask and django, now I'm learning next.js development, and struggling to figure out how to implement session.

My project is using koa as the web server and next.js as one middleware, code like this

import next from "next";
import Koa from "koa";
import Session from "koa-session";
import Router from "koa-router";

...
const next_app = next({...});
const handle = next_app.getRequestHandler();

next_app.prepare().then(async () => {
  const server = new Koa();
  const router = new Router();
  server.use(Session(server));  // use koa-session middleware
  ...
  router.get("(.*)", async (ctx) => {
    console.log("server.js session: ", ctx.session);
    ...
    // create or update session data
    ctx.session.custom_data += 123;
    
    // but how to pass ctx.session to handle(), then to page components?
    await handle(ctx.req, ctx.res);
});

In the above code, ctx.session carries the session data for each request, but the problem is I don't know how to pass the session data to next.js, because the next.js entry function call handle(ctx.req, ctx.res) doesn't take extra session data as arguments.

Then I look at next-auth, which also provide session functionalities, and I'm really deeply confused, which one to use and why?