在Next.js中使用Strapi时遇到了水合问题。我正在通过GraphQL获取所有数据。Strapi给了我不带http:/localhost:/1337的图像的路径。由于这与生产现场不同,我决定创建一个ENV变量。为了将其解析为完整的图像路径,我创建了一个函数:
interface ImageProp {
data: {
attributes: {
url: string,
}
}
}
export function strapiImage(src: ImageProp) {
return process.env.STRAPIHOST + src.data.attributes.url;
}
在浏览器控制台中,最近打开Next.js项目时,我开始收到一个错误。以前没有,我不明白现在从哪来的:
client.js:1 Warning: Prop `src` did not match.
Server: "http://localhost:1337/uploads/illustration_cleaning_4c030558a9.svg"
Client: "undefined/uploads/illustration_cleaning_4c030558a9.svg"
如果我在函数代码中将变量更改为字符串'localhost:1337',错误就会消失。你能告诉我这可能是关于什么以及如何解决它吗?
1条答案
按热度按时间smdncfj31#
为了向浏览器公开一个变量,你必须给变量加上前缀
NEXT_PUBLIC_
尝试将env更改为
NEXT_PUBLIC_STRAPIHOST