新图片上传到公共文件夹（本地 - 项目）不出现（下一个 js 项目）答案

【问题标题】：new pics upload to public folder (local - project) not appear (next js project)新图片上传到公共文件夹（本地 - 项目）不出现（下一个 js 项目）
【发布时间】：2021-12-28 09:56:16
【问题描述】：

[在此处输入图片描述][1]我的下一个 js 项目有问题：在开发模式下，将新图片上传到公用文件夹并重新渲染图片时会出现，但何时执行此操作构建模式（生产）图片不出现并重新渲染组件停止。

处于开发模式 [1]：https://i.stack.imgur.com/Fw9TC.gif

 export async function getServerSideProps(context) {
 const session = await getSession({ req: context.req });
 if (!session) {
 return {
  redirect: {
    destination: "/auth",
    permanent: false,
  },
};
} else if (![1, 21].includes(session.user.jobID)) {
return {
  redirect: {
    destination: "/",
    permanent: false,
  },
};
}
const getEmpsFromAPI = await User.find().exec();
const getEntries = await jobs.find().exec();
// const emps = getEmpsFromAPI;
const dataJson1 = JSON.stringify(getEmpsFromAPI);
const dataJson2 = JSON.stringify(getEntries);

return {
props: {
  empss: dataJson1,
  entriess: dataJson2,
  session,
},
};
}

【问题讨论】：

澄清一下：您将图像添加到公用文件夹，然后执行yarn build 和yarn start 并且图像没有出现？
no 在构建和启动后不会出现任何上传到公共文件夹的图片，但它会成功上传，当我停止启动并重新启动系统时，它会出现@gazdagergo
嗯，你能添加加载上传图片的代码吗？我怀疑您在构建时预渲染页面，然后只静态提供它
这是否回答了您的问题：How to access files uploaded to the public folder in Next.js?？ Next.js 不会提供在运行时添加到 public 文件夹的文件。
是的，这是解决这个问题的唯一方法，我必须建立另一个快速服务器来处理新的上传图片到下一个 js

标签： reactjs next.js

【解决方案1】：

这是预期的行为。只有在构建时存在于公用文件夹中的图像才会在运行时作为静态图像提供。图像出现在开发模式下的原因是由于添加了新的图像文件而触发了热重载（实际上是重新构建）。

我从 dzino 找到了一个用于 nextjs 图片上传的好例子。看看那个：https://codesandbox.io/s/thyb0

【讨论】：

【解决方案2】：

在您的项目根目录中创建一个名为 static 的文件夹。然后，您可以从您的代码中使用 /static/ URL 引用这些文件：

export default () => <img src="/static/my-image.png" alt="my image" />

/public
    /static
        my-image.png

参考：https://stackoverflow.com/a/54436083

【讨论】：

谢谢，Pradip，但我的问题是上传的新图片永远不会出现在公共文件夹中