NextJS ImageError：无法优化图像且无法回退到上游图像

Question

我创建了中间件并/((?!api|_next/static|_next/image|favicon.ico|auth/login).*)在配置中间件中添加了匹配器。当我尝试运行时npm run dev。结果如下：

ImageError: Unable to optimize image and unable to fallback to upstream image
    at imageOptimizer (C:\work\internal-dashboard\node_modules\next\dist\server\image-optimizer.js:563:19)
    at async cacheEntry.imageResponseCache.get.incrementalCache (C:\work\internal-dashboard\node_modules\next\dist\server\next-server.js:238:72)
    at async C:\work\internal-dashboard\node_modules\next\dist\server\response-cache\index.js:83:36 {
  statusCode: 400
}
ImageError: Unable to optimize image and unable to fallback to upstream image
    at imageOptimizer (C:\work\internal-dashboard\node_modules\next\dist\server\image-optimizer.js:563:19)
    at async cacheEntry.imageResponseCache.get.incrementalCache (C:\work\internal-dashboard\node_modules\next\dist\server\next-server.js:238:72)
    at async C:\work\internal-dashboard\node_modules\next\dist\server\response-cache\index.js:83:36 {
  statusCode: 400
}

在我添加中间件之前，这种情况没有发生，当我在中间件中添加配置匹配器时发生这种情况。这是我制作的中间件上的配置匹配器：

export const config = {
  matcher: [
    '/((?!api|_next/static|_next/image|favicon.ico|auth/login).*)',
    '/partner/:path*'
  ],
};

我试图_next/image从中间件匹配器中省略。导致部分图片无法加载。

有办法破案吗？或者也许我在制作中间件时忘记了一些东西？

Answer 1

当我添加middleware.[jt]s. 我意识到所有的路径都被它匹配。

所以我添加了这个：

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

但没有成功。 后来我更新了正则

表达式以包含文件夹，因为我的图像为. 所以，我的工作正则表达式现在看起来像这样：images public/images/my-image.png

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

差异 TLDR

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