NEXT/图像组件 URL 问题

Question

我正在使用 NEXT/Image 组件并面临这个问题：

当我在 chrome 上打开源代码时，图像 src 是这样的：

https://www.example.com/_next/image?url=%2Fimages%2Fhome%2FDog-image-1.jpg&w=384&q=100

但是当我让谷歌在搜索控制台中抓取网站并查看谷歌如何看待它的代码时，我看到的图像网址如下：

https://www.example.com/_next/image?url=%2Fimages%2Fhome%2FDog-image-1.jpg&w=384&q=100​

URL 已将“&”字符更改为“& amp;” 这会阻止 google 对图像建立索引，因为此 URL 会出现以下错误：

400：BAD_REQUEST 代码：INVALID_IMAGE_OPTIMIZE_REQUEST

谷歌无法抓取这些图像并将其编入索引，因为它似乎是一个损坏的链接。

知道为什么会发生这种情况吗？

谢谢。

Answer 1

我今天也遇到了这个问题。我找到了这个问题的答案解决了我的问题。创建一个加载函数并将其传递给图像组件。

const loaderProp =({ src }) => {
    return src;
}

<Image
      src={currentImage.imageurl}
      alt={currentImage.imageurl} 
      layout="fill"
      className={styles.imageSize} 
      loader={loaderProp}
/>