小编pak*_*pak的帖子

NextJS 13:如何将数据从中间件传递到组件?

在带有 app 文件夹的 NextJS 13 中,我需要根据 url(来自例如 /en/asdf/或 的语言/de/asdf/)获取数据并将其传递给组件。
我尝试使用中间件,使用 cookie 似乎工作得相对较好,但有一个大问题 - cookie 仅在下一次重新加载后在组件中可用,而不是立即可用。
有什么方法可以将数据从中间件传递到组件吗?
或者其他什么,比如一些全局变量?

我的中间件的简码:

import { NextResponse } from 'next/server'

export const middleware = (req) => {
    const pathname = req.nextUrl.pathname
    const language = pathname.split('/')[1]
    const allowedLanguages = ['en', 'de'];

    if(allowedLanguages.includes(language)) {
        const response = NextResponse.rewrite(new URL(pathname.replace(`/${language}`, ''), req.url))
        
        // This works only after browser reload
        response.cookies.set('language', language)

        return response
    }
}

export const config = {
    matcher: ['/((?!assets|api|_next/static|favicon.ico).*)'],
}


Run Code Online (Sandbox Code Playgroud)

谢谢

next.js next.js13

7
推荐指数
1
解决办法
2868
查看次数

标签 统计

next.js ×1

next.js13 ×1