在next js中重写镜像地址的规则

okxuctiv 于 12个月前发布在其他

关注(0)|答案(1)|浏览(74)

我使用了next/image，所以在ssr页面和next server中，它从地址中获取图像如下：
“http：//inner-server-ip/img/pic1.png”
所以next将其更改为
“/_next/image？url= http：//inner-server-ip/img/pic1.png”，
我想要的是隐藏“http：//inner-server-ip”在客户端浏览器（出于安全原因），所以我试图使用重写规则（somthing喜欢如果我的网址开始与/img然后附加服务器到它），但弄清楚它不工作的图像优化路由，或者我错了，有什么办法我想做什么？

next.js

来源：https://stackoverflow.com/questions/77720580/rewrite-rule-in-next-js-for-image-address

1条答案

按热度按时间

yx2lnoni1#

对于想要这样做的人，您可以在具有更灵活编码能力的中间件上创建重写规则，
1-我首先从src中删除了服务器ip（或addr），以便它是一个相对地址
2-然后把我的rewrite规则的条件放在next js的中间件中，类似这样：

if(~req.url.indexOf("_next/image?url=%2Fbackend_img%2F")){
    const idx = url.indexOf("%2Fbackend_img%2F")
    const newUrl = `/_next/image?url=${backendIp}${req.url.slice(idx)}`;
    return NextResponse.rewrite(new URL(newUrl, req.url))
}

字符串
所以当请求像这样来时：

"_next/image?url=/backend_img/sample.png"

型
它将在几个方面反映这一点：

"_next/image?url=${backendIp}/backend_img/sample.png"

型

赞(0）回复(0）举报 12个月前

我来回答

在next js中重写镜像地址的规则

1条答案

相关问题

热门标签

最新问答