使用中间件时，客户端未定义 getServerSideProps 道具

Question

赏金将在 6 天后到期。 此问题的答案有资格获得+50声望赏金。 kennsorr想让更多人关注这个问题。

如果使用 Nextjs 中间件满足特定条件，我将尝试在每个页面上进行重定向。

出于某种原因，每当 middleware.ts 中的matcher匹配页面时，该页面上getServerSideProps的所有道具在到达客户端时都是undefined 。 当我从matcher正则表达式中删除页面时，它们会按预期使用正确的值工作。

中间件.ts

import { NextResponse } from 'next/server';
import type { NextRequest } from 'next/server';

export default async function middleware(req: NextRequest) {
  return NextResponse.next();
}

export const config = {
  matcher: ['/(tag|about)(.)*'],
};

我如何确保getServerSideProps仍然在同样触发middleware function 的页面上触发？

（ getServerSideProps正在触发，我在终端中看到了正确的值，但我在客户端仍然没有undefined ）

Answer 1

将 middleware.ts 移动到正确的位置，只会在 /tag|about 页面上运行

|-- pages/
│   ├── tag/
│   │   ├── index.js
│   │   └── middlware.js

import { NextResponse } from 'next/server'
import type { NextRequest } from 'next/server'
 
// This function can be marked `async` if using `await` inside
export default async function middleware(req: NextRequest) {
 if (request.nextUrl.pathname) {
  return await NextResponse.redirect(new URL('/home', request.url))
 }

 return NextResponse.next()
  
}
 
export const config = {
  matcher: ['/(tag|about)(.)*'],
};