运行时出现一个报错

Gu-f commented 2 years ago

findyourmagic commented 2 years ago

用的什么浏览器？最好先用 chrome 吧，暂时没有做太多兼容性方面的工作。

Gu-f commented 2 years ago

用的是chrome

root@6a7917a453c6:/opt/dber# node -v
v18.6.0 root@6a7917a453c6:/opt/dber# npm -v 8.13.2

findyourmagic commented 2 years ago

我尝试下了在 node v18 下运行，能够正常运行。根据上面的报错信息，推测还是浏览器版本的问题，你看看浏览器版本号，然后升级到最新版本再试试呢？

Gu-f commented 2 years ago

我看了下chrome版本，是最新版的

Chrome 已是最新版本版本 103.0.5060.134（正式版本）（64 位）

然后我又尝试了firefox，依然是同样的问题

firefox: 版本: 102.0.1 (64 位)

findyourmagic commented 2 years ago

太奇怪了，在浏览器开发者工具的控制台输入

window.crypto.randomUUID();

看看返回值是什么？

Gu-f commented 2 years ago

报错，返回这个

Uncaught TypeError: window.crypto.randomUUID is not a function
    at <anonymous>:1:15

除此之外我发现还有另外一个错误，不清楚有没有影响：报错如下

next-dev.js?3515:24 Warning: Failed prop type: Invalid prop `in` of type `string` supplied to `CSSTransition`, expected `boolean`.
    at CSSTransition (webpack-internal:///./node_modules/react-transition-group/esm/CSSTransition.js:115:35)
    at Modal (webpack-internal:///./node_modules/@arco-design/web-react/es/Modal/modal.js:107:68)
    at ImportModal (webpack-internal:///./components/import_modal.js:73:28)
    at LoadableImpl (webpack-internal:///./node_modules/next/dist/shared/lib/loadable.js:79:9)
    at div
    at ListNav (webpack-internal:///./components/list_nav.js:40:62)
    at Home (webpack-internal:///./pages/graphs/index.js:117:81)
    at MyApp (webpack-internal:///./pages/_app.js:14:27)
    at ErrorBoundary (webpack-internal:///./node_modules/next/dist/compiled/@next/react-dev-overlay/dist/client.js:8:20740)
    at ReactDevOverlay (webpack-internal:///./node_modules/next/dist/compiled/@next/react-dev-overlay/dist/client.js:8:23199)
    at Container (webpack-internal:///./node_modules/next/dist/client/index.js:149:9)
    at AppContainer (webpack-internal:///./node_modules/next/dist/client/index.js:652:26)
    at Root (webpack-internal:///./nod

findyourmagic commented 2 years ago

另外一个没关系的，看来可能是你的浏览器有点问题啊，chrome 支持 crypto.randomUUID 这个 API 的，正常应该是会返回一个 uuid。就像这样

Gu-f commented 2 years ago

但是奇怪的是我在您demo环境下是正常的，同一个浏览器。

我尝试用node16试了下，也是同样的问题，您可以尝试复现下看看能不能复现：使用的node16的docker镜像 docker pull node:16-alpine3.15 git clone https://github.com/findyourmagic/dber.git

Gu-f commented 2 years ago

window.crypto.randomUUID(); 这个命令在其他页面都是正常的能输出uuid，只有在您这个dber界面会出现那个问题

findyourmagic commented 2 years ago

好的，随后我试试看能否复现

findyourmagic commented 2 years ago

@Gu-f 我先把代码clone下来，然后新建了个 Dockerfile

FROM node:16-alpine3.15
COPY . /dber
WORKDIR /dber/
RUN npm install && \
    npm run build

CMD ["npm", "start"]

build 完以后，用 docker run 跑了起来，没能复现你说的这个情况。你再试试看看吧，随后我测试完以后会把 Dockerfile 放到仓库里。

另外，使用 npm run gen 可以直接生成静态的页面，部署到任意服务器下面，这样就不用启 node 服务了。

findyourmagic commented 2 years ago

@Gu-f Good job. 但是现在 dockerfile 是在 dev 模式下运行的，如果能在生产模式下启动就更好了，这个 issue 先关闭了。

zsenliao commented 2 years ago

我是 macOS 下最新版的 Chrome(版本 103.0.5060.134)，开发下可以正常运行，但生成静态文件下会报错。报错是打包压缩后的 c.g.randomUUID() 不存在之类的信息，估计是早先版本 index.js 下的 global.crypto.randomUUID() 导致的

Gu-f commented 2 years ago

@zsenliao Fixed, Great!

findyourmagic / dber

运行时出现一个报错 #12

用的是chrome