node.js - Next.js 从文件夹内的文件获取静态路径名

Question

我正在尝试使用 getStaticPaths 从公共(public)文件夹内的 JSON 文件名中提取的 id。我的做法如下

export async function getStaticPaths() {
  const directoryPath = path.join(__dirname, "../../../../public/db/");
  var fileNames = [];
  fs.readdir(directoryPath, function (err, files) {
    if (err) {
      return console.log("Unable to scan directory: " + err);
    }
    files.forEach(function (file) {
      fileNames.push(file.substring( 0, file.indexOf(".")))
    });
  });

  console.log("fileNames",fileNames);

  return {
    fallback: false,
    paths: [
      {
        params: {
          reportId: "temp1",
        },
      },
      {
        params: {
          reportId: "temp2",
        },
      },
    ],
  };
}

我正在尝试将文件名推送到名为 fileNames 的数组中。但我只看到一个空数组。我尝试登录我的 forEach 方法，在那里我可以清楚地看到我的名字。所以我的问题是为什么push方法在这里没有做任何事情？

Answer 1

这是因为 readdir 回调是异步调用的，当您到达 console.log("fileNames", fileNames) 时，forEach code> 循环尚未运行。

我建议使用同步 readdirSync版本。

const directoryPath = path.join(__dirname, "../../../../public/db/");
const fileNames = [];
const files = fs.readdirSync(directoryPath);
files.forEach(function (file) {
    fileNames.push(file.substring(0, file.indexOf(".")));
});

console.log("fileNames", fileNames);

或者，基于 promise 的readdir来自fs/promises。

import { readdir } from 'fs/promises';

const directoryPath = path.join(__dirname, "../../../../public/db/");
const fileNames = [];
try {
    const files = await readdir(directoryPath);
    files.forEach(function (file) {
        fileNames.push(file.substring(0, file.indexOf(".")));
    });
    console.log("fileNames", fileNames);
} catch (err) {
    console.log("Unable to scan directory: " + err);
}