javascript - 如何在 NextJs 中生成 UUID？

标签 javascript reactjs webpack next.js cryptojs

<分区>

我正在尝试这个

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？

最佳答案

因为 crypto 是 Node.js 中的内置模块，您不能在客户端使用它。您可以使用 uuid 或 short-uuid 等外部库来生成 uuid:

import { v4 } from "uuid";

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

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

关于javascript - 如何在 NextJs 中生成 UUID？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/71851190/

上一篇：python - 将列拆分为多列，在 Pandas 中具有唯一值

下一篇：rust - 如果不允许同时使用两个可变引用，那为什么还要允许它们呢？

相关文章：

javascript - 更新主干模型/ View 的轮询请求

javascript - 如何从数据选择的输入选项中获取值？

javascript - 属性的单元测试失败，只能在单个节点上运行？

javascript - 在 ReactJS 中的 VisJS 网络图的 Canvas 上添加多个节点框选择器

reactjs - 设置选项卡导航器时出错 - ' Got an invalid Value for ' 组件的屏幕 'Home' Prop

php - 未捕获的异常 : Unable to locate Mix file

javascript - 网页需要重新加载才能显示 javascript 内容...在除 MSIE 之外的所有浏览器中

javascript - 如何使用 Sequelize 检索不属于多对多关联的所有记录

npm - `npm run watch` 在 Laravel 5.4 中无法停止

angular - 我有一个新项目，但是当执行 ng serve 时，我得到错误