我的nextjs应用程序中有一个反应组件,它使用next/image:
<Image
src={`http://backend${image.url}`}
alt={image.alt}
width={image.width}
height={image.height}
/>
在 linesrc={'http://backend${image.url}'}中,backend是 kubernetes 服务的名称,通过它可以将图像用于nextjs微服务。
当我部署它时,微服务在渲染组件nextjs时崩溃(没有错误) 。<Image />(没有<Image />渲染的页面没有任何问题。)
我不知道原因,但pod重新启动nexjs容器。我检查kubectl top pod了是否是因为资源限制,但没有发现 CPU/RAM 限制。
映像位于预配置的 Kubernetes 卷中。有两个nginx微服务为图像提供服务:
其中之一将图像提供给世界,例如网络浏览器可以请求这样的图像:(
/media/images/image-1.jpg效果很好。)另一个将图像提供给
nextjs微服务。它包括一个名为backend. 例如在nextjs容器中可以像这样请求图像:<Image src={'http://backend${image.url}' ... />
当我关闭图像优化 ( unoptimized={true}) 并更改src从 Web 浏览器(而不是nextjs微服务)获取图像时,一切正常:
<Image
unoptimized={true}
src={`${image.url}`}
alt={image.alt}
width={image.width}
height={image.height}
/>
我想要图像优化功能。如何处理这个问题。提前致谢!
更新
有没有办法在微服务中做到"http://backend/media/image-1.jpg"平等?那么这将得到解决?"/media/image-1.jpg"nextjs"/media/image-1.jpg""http://backend/media/image-1.jpg"