はじめに

Cloudflare WorkersでNext.jsを開発しているときにエラーに時間がかかったのでまとめます

問題

npm run previewをすると以下のエラーが出るようになりました

✘ [ERROR] Error: Disallowed operation called within global scope. Asynchronous I/O (ex: fetch() or connect()), setting a timeout, and generating random values are not allowed within global scope. To fix this error, perform this operation within a handler. https://developers.cloudflare.com/workers/runtime-apis/handlers/

      at Js.ge.__chunk_2976
  (file:///home/jinwatanabe/workspace/gigafile-clone-app/.vercel/output/static/_worker.js/__next-on-pages-dist__/webpack/5f9c3c5ca34a56d5b98423dc5279b2aa.js:59:15708)
      at n
  (file:///home/jinwatanabe/workspace/gigafile-clone-app/.vercel/output/static/_worker.js/__next-on-pages-dist__/functions/files/[id].func.js:1:15438)
      at Js.ge.__chunk_6938
  (file:///home/jinwatanabe/workspace/gigafile-clone-app/.vercel/output/static/_worker.js/__next-on-pages-dist__/webpack/5f9c3c5ca34a56d5b98423dc5279b2aa.js:1:135163)
      at n
  (file:///home/jinwatanabe/workspace/gigafile-clone-app/.vercel/output/static/_worker.js/__next-on-pages-dist__/functions/files/[id].func.js:1:15438)
      at Js.ge.__chunk_4389
  (file:///home/jinwatanabe/workspace/gigafile-clone-app/.vercel/output/static/_worker.js/__next-on-pages-dist__/webpack/5f9c3c5ca34a56d5b98423dc5279b2aa.js:37:4118)
      at n
  (file:///home/jinwatanabe/workspace/gigafile-clone-app/.vercel/output/static/_worker.js/__next-on-pages-dist__/functions/files/[id].func.js:1:15438)
      at Js.ge.__chunk_805
  (file:///home/jinwatanabe/workspace/gigafile-clone-app/.vercel/output/static/_worker.js/__next-on-pages-dist__/webpack/5f9c3c5ca34a56d5b98423dc5279b2aa.js:77:30985)
      at n
  (file:///home/jinwatanabe/workspace/gigafile-clone-app/.vercel/output/static/_worker.js/__next-on-pages-dist__/functions/files/[id].func.js:1:15438)
      at Js.ge.__chunk_2823
  (file:///home/jinwatanabe/workspace/gigafile-clone-app/.vercel/output/static/_worker.js/__next-on-pages-dist__/webpack/5f9c3c5ca34a56d5b98423dc5279b2aa.js:65:17569)
      at n
  (file:///home/jinwatanabe/workspace/gigafile-clone-app/.vercel/output/static/_worker.js/__next-on-pages-dist__/functions/files/[id].func.js:1:15438)

ページにアクセスすると500エラーになります
シンプルなページにしても起きました

解決方法

Next.jsを14系に変更しまして治りました
15系ではnext-on-pageが対応できていないのかエラーが発生しているようです

おわりに

tailwindcssもnext14に対応する必要がありま