来自下一个/图像的 400 个错误请求

问题描述

所以我试图用 next/image 的组件显示图像。但是，图像并未显示。我相信这是因为 next/image 给我一个 400 bad request 错误。

当我单击该 URL 时，它显示“请求的资源不是有效图像”，这很奇怪，因为在从后端检索图像 URL 后，我可以下载图像以查看它是否有效图像，因此在将图像链接传递到组件的道具后立即发生此错误。基本上，我的请求是正确的，但是 next/image 与图像 url 的交互被搞砸了。奇怪的是，我几天前也没有出现这个错误，在没有改变任何东西后，我看到了这个错误。

我已经像这样配置了 next.js 配置文件，对后端的请求确实检索了一个可下载的图像（next/image 只是没有正确显示它）。

这是我的 next.js 配置文件：

const withPlugins = require('next-compose-plugins');
const withImages = require('next-images');

const nextConfig = {
  images: {
    domains: [
      'url.s3.amazonaws.com','url.s3.amazonaws.com',],},};


module.exports = withPlugins([[withImages]],nextConfig);

解决方法

此问题是由于 next.js 版本 11。该问题已在 next@11.0.2-canary.4 版本中修复。您可以更新版本。问题就解决了。

,

你更新你的 nextjs 版本了吗？ 似乎 10.1.X 和更新版本有一些问题...... https://github.com/vercel/next.js/issues/23523