如何在 NextJs 中生成 UUID？

Question

我正在尝试这个

import { randomUUID } from 'crypto'
var id = randomUUID()

在我的 NextJs 应用程序中，但出现此错误：

index.js?46cb:369 Uncaught TypeError: (0 , crypto__WEBPACK_IMPORTED_MODULE_5__.randomUUID) is not a function at eval (index.js?bee7:8:20) at Module../pages/index.js (index.js?ts=1649816623582:5680:1) at Module.options.factory (webpack.js?ts=1649816623582:618:31) at webpack_require (webpack.js?ts=1649816623582:37:33) at fn (webpack.js?ts=1649816623582:287:21) at eval (?595a:5:16) at eval (route-loader.js?ea34:235:51)

加密库似乎可用于 NextJs 中的中间件（尽管它应该在浏览器中可用），但实现起来似乎很复杂。谁能建议如何在 NextJs 中生成 UUID？

Answer 1

因为crypto是Node.js中的build-in模块，不能在客户端使用。您可以改用 uuid 或 short-uuid 等外部库：

import { v4 } from "uuid";

v4(); // deadbeef-deadbeef-deadbeef-deadbeef or some uuid

使用外部 cross-platform 库允许您在服务器和客户端中使用它，这将解决问题。

Answer 2

加密是 built-in 节点模块。您不能在客户端使用它。使用这个 uuid Package

import { v4 as uuidv4 } from 'uuid';
uuidv4(); // ⇨ '9b1deb4d-3b7d-4bad-9bdd-2b0d7b3dcb6d

如何在 NextJs 中生成 UUID？

How to generate a UUID in NextJs?

javascript

cryptojs

reactjs

webpack

next.js