NextJS/Image：“url”参数有效，但上游响应无效

Question

我正在尝试从 Strapi 获取图像到我的 NextJS 应用程序中，但无论我尝试做什么，我总是收到错误

“url”参数有效，但上游响应无效”

控制台显示：

无法加载资源：服务器响应状态为 400（错误请求）

我已经将“next”更新到最新版本：

这是我的图像代码的片段：

我还可以尝试什么才能不再收到错误？

Answer 1

我认为您没有将源添加到图像域，可能您应该在此处阅读有关图像文档的更多信息https://nextjs.org/docs/api-reference/next/image

要消除此错误，请在项目的根目录中创建一个“next.config.js”文件。将除本地主机之外的所有图像的域添加到域数组中，如下所示：

module.exports = {
  reactStrictMode: true,
  images: {
    domains: [
      "platform-lookaside.fbsbx.com", //facebook
      "firebasestorage.googleapis.com", //firebase-storage
      "scontent-atl3-2.xx.fbcdn.net", //facebook
      "pbs.twimg.com", //twitter
    ],
  },
};

因此，在您的情况下，您是从外部源获取的，不包括“localhost”