如何从 next.js 中的 url 访问公用文件夹中的文件答案

【问题标题】：how to access files in public folder from url in next.js如何从 next.js 中的 url 访问公用文件夹中的文件
【发布时间】：2023-02-13 21:28:10
【问题描述】：

我在下一个允许用户上传图像的 js 项目中，我将图像存储在我的公共目录中，有什么方法可以使用 mydomain.com/public/coverimg/image.jpg 之类的 url 结构访问我的文件

这是我下面的 api 代码。

 import { rejects } from 'assert';
import { resolve } from 'path';
import { promises } from 'stream';

const fs = require('fs');
const moment = require('moment');
const formidable = require('formidable-serverless');
var slugify = require('slugify');
const path = require('path');
const crypto = require('crypto');

export const config = {
  api: {
    bodyParser: false,
  },
};

const handler = async (req, res) => {
  const timeStamp = moment().format('DD_MM_YYYY');

  const Image_id = crypto.randomBytes(16).toString('hex');

  fs.mkdir(
    `./public/coverimg/${timeStamp}`,
    { recursive: true },
    function (err) {
      res.send(err);
    }
  );

  const data = await new Promise((resolve, rejects) => {
    const form = formidable({
      multple: false,
      uploadDir: `./public/coverimg/${timeStamp}`,
    });

    
    form.KeepExtentions = true;
    form.KeepFileName = true;
    form.maxFields = 1000;

    form.on('fileBegin', function (name, file) {
      file.path = path.join(
        `./public/coverimg/${timeStamp}`,
        Image_id + '_' + slugify(file.name)
      );
    });

    // console.log(data);
    form.parse(req, (error, fields, files) => {
      if (error) return rejects(error);
      resolve(files);
    });
  });
};

export default handler;

【问题讨论】：

好吧，默认情况下，您可以通过导航访问 public 文件夹中的任何文件，例如 domain.com/filename.jpg 如果您有嵌套目录，那么您也可以以相同的方式访问它们。除非你想在运行时上传和访问，在这种情况下，看看this

标签： javascript next.js

【解决方案1】：

您应该以以下格式共享 URL：

{YOUR_DOMAIN}/{IMAGE_NAME}.{FORMAT}

例如

https://my.app.domain/1676292852306cle2thet7000iv73y7xk39o2d.png

注意：不要在您的共享网址中包含 /public/。

【讨论】：