Next.js 13 appDir：如何通过express-session Cookie在服务端获取用户？

我有一个基于express-session的API，想要在Next.js的服务端组件中获取用户信息，或创建中间件校验用户是否已认证，但遇到了问题：

在服务端组件中调用API时，服务端无法识别会话Cookie/ID，fetch结果始终为null：

// app/dashboard/page.tsx
import React, { Suspense } from "react";

async function getUser() {
    const user = await fetch("http://localhost:3100/trpc/user.me", {credentials: "include"}).then((res)=> res.json())
    console.log(user) // null
    return user
}

const Comp = async ({ children }: { children: React.ReactNode }) => {
    const user = await getUser()
    return (
        <>
            <Suspense fallback={<div>Loading user...</div>}>
                <div>{user.displayName}</div>
            </Suspense>
        </>
    );
}

export default Comp;

于是我尝试创建中间件传递会话Cookie，但同样失败：

// middleware.tsx
import { NextResponse } from 'next/server'
import type { NextRequest } from 'next/server'

export function middleware(request: NextRequest) {

    const sCookie = "xid";
    
    const session = request.cookies.get(sCookie)?.value
    console.log(session) // s:w43gRjd whatever

    async function getUser() {
        const user = await fetch("http://localhost:3100/trpc/user.me", {credentials: "include"}).then((res)=> res.json())
        console.log(user) // null
    }
    getUser()

    const response = NextResponse.next()

    // Add session cookie to response
    if (request.cookies.has(sCookie)) {
        response.cookies.set(sCookie, session!)
    }
    return response
}

export const config = {
    matcher: [
        "/((?!api|_next/static|favicon.ico).*)", // don't execute middleware when hitting static assets
    ],
}

解决方法 #

我已解决该问题，需要在请求中手动携带Cookie：

const xid = cookies().get("xid")
    
if (!xid) return null
    
const user = await fetch(`${process.env.NEXT_PUBLIC_API_URL}/user.me`, {
   credentials: "include",
   headers: { Cookie: `${xid.name}=${xid.value}`}
}).then(res => res.json()).then(res => res.result.data)

内容的提问来源于stack exchange，提问作者Fluxium