Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Nuxt Error on Deployment using 'vercel-edge' preset: "An internal error occurred with Vercel. BAD_GATEWAY". Works locally. #135

Closed
dosstx opened this issue Jun 17, 2023 · 14 comments
Closed

Nuxt Error on Deployment using 'vercel-edge' preset: "An internal error occurred with Vercel. BAD_GATEWAY". Works locally. #135

dosstx opened this issue Jun 17, 2023 · 14 comments

Comments

@dosstx
Copy link
Contributor

dosstx commented Jun 17, 2023 •
edited

When setting the nitro preset to vercel-edge and deploying the example code from here to Vercel, I get following server response:

An internal error occurred with Vercel.

BAD_GATEWAY

It WORKS locally, but not when deployed to Vercel

Also, when not using the vercel-edge preset, the code works when deployed EXCEPT it will not stream the data (only show the server data response when it is completed, instead of incremently).

Anyone got any ideas how to get stream work using vercel-edge?

My nuxt.config.ts file:

export default defineNuxtConfig({
  nitro: {
    preset: 'vercel-edge'
  },
  devtools: { enabled: true },
  modules: ['@nuxtjs/tailwindcss'],
  runtimeConfig: {
    openaiApiKey: ''
  }
})
@dosstx dosstx mentioned this issue Jun 17, 2023
Closed
@dosstx dosstx changed the title Nuxt Deployment: 502 bad gateway with example code from doc. Works locally. Nuxt Error on Deployment: "An internal error occurred with Vercel. BAD_GATEWAY". Works locally. Jun 19, 2023
@dosstx dosstx changed the title Nuxt Error on Deployment: "An internal error occurred with Vercel. BAD_GATEWAY". Works locally. Nuxt Error on Deployment using 'vercel-edge' preset: "An internal error occurred with Vercel. BAD_GATEWAY". Works locally. Jun 19, 2023
@dosstx
Copy link
Contributor Author

dosstx commented Aug 17, 2023

Just a note that this still does not work even with the new updates

@MaxLeiter
Copy link
Member

MaxLeiter commented Aug 17, 2023 •
edited

@pi0 has a demo here: https://nuxt-openai-demo.vercel.app/

Can you share a link to a deployment?

@dosstx
Copy link
Contributor Author

dosstx commented Aug 18, 2023

@MaxLeiter I just clicked the "deploy to Vercel" button and it deployed but says "edge function crashed":
https://vercel-ai-chat-nuxt-openai-psi.vercel.app/

@pi0
Copy link
Contributor

pi0 commented Aug 18, 2023 •
edited

Hi. Checking with latest example in your repository, i can reproduce as well.

My demo was using openai-edge (https://github.com/pi0/nuxt-openai-demo/blob/main/package.json#L17) but here we use openai@4 package.

openai@4, pulls in node-formdata dependency. (next nitro version might also fixes with new export conditions or unjs/unenv#131)

Currently with latest Nitro/Nuxt versions, edge is supported out of the box. The normal lambda functions requires a new experimental flag for the build output that will be enabled very soon in stable release. (in the meantime you can use nuxt edge channel).

@Hebilicious
Copy link
Contributor

Hebilicious commented Aug 18, 2023 •
edited

Looks like the example was updated from openai-edge to the regular version as a part of this PR https://github.com/vercel/ai/pull/438/files#diff-2cc356384a90a7318fac271ae474cfa9db3151656c8540d2ba0902ad27a28e61

The module that causes problem is formdata-node https://github.com/search?q=repo%3Aopenai%2Fopenai-node%20formdata-node&type=code

@dosstx
Copy link
Contributor Author

dosstx commented Aug 18, 2023

That was indeed the issue. Thanks!

@dosstx
Copy link
Contributor Author

dosstx commented Aug 19, 2023

@pi0 @Hebilicious For some reason, the deployment fails again. I did get it to work previously after updating the package.json Nuxt version from ^3.6.5 to "nuxt": "npm:nuxt3@latest", . Doing that worked the first time. But now, everytime I make a new deployment (all I did in this case was change the readme file!) , the deploy fails and says:

500: INTERNAL_SERVER_ERROR
Code: EDGE_FUNCTION_INVOCATION_FAILED
ID: cle1::xz5hf-1692444456913-68b8c2ff7eeb

Demo link https://vercel-ai-chat-nuxt-openai-git-main-dosstx.vercel.app/

Public repo: https://github.com/dosstx/vercel-ai-chat-nuxt-openai

@pi0
Copy link
Contributor

pi0 commented Aug 20, 2023

Thanks for sharing reproduction @dosstx. Can you please give function errors also any (possible) build warnings? (to help to debug easier, set nitro: { minify: false } in your nuxt.config)

@dosstx
Copy link
Contributor Author

dosstx commented Aug 20, 2023 •
edited

Thanks for sharing reproduction @dosstx. Can you please give function errors also any (possible) build warnings? (to help to debug easier, set nitro: { minify: false } in your nuxt.config)

URL: https://vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app/

I made a new deployment and this is what I have:

nuxt.config.js:

  nitro: {
    minify: false,
    preset: 'vercel-edge' // you can use 'vercel' or other providers here
  },

Deployment build log:

<html>
<body>
<!--StartFragment-->

[nitro] Nitro now uses `isr` option to configure ISR behavior on Vercel. Backwards-compatible support for `static` and `swr` options within the Vercel Build Options API will be removed in the future versions. Set `future.nativeSWR: true` nitro config disable this warning.
--
14:20:18.660 | [info] [nitro] Building Nitro Server (preset: `vercel-edge`)
14:20:19.784 | node_modules/openai/core.mjs (2:3) The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
14:20:19.784 | node_modules/openai/core.mjs (2:11) The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
14:20:19.785 | node_modules/openai/core.mjs (16:3) The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
14:20:19.785 | node_modules/openai/core.mjs (16:11) The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
14:20:20.520 | node_modules/formdata-node/lib/esm/fileFromPath.js (1:30) The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
14:20:20.520 | node_modules/formdata-node/lib/esm/fileFromPath.js (1:38) The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
14:20:20.520 | node_modules/formdata-node/lib/esm/fileFromPath.js (7:30) The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
14:20:20.521 | node_modules/formdata-node/lib/esm/fileFromPath.js (7:38) The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
14:20:20.748 | node_modules/formdata-node/lib/esm/FormData.js (1:30) The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
14:20:20.749 | node_modules/formdata-node/lib/esm/FormData.js (1:38) The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
14:20:20.759 | node_modules/formdata-node/lib/esm/Blob.js (2:30) The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
14:20:20.759 | node_modules/formdata-node/lib/esm/Blob.js (2:38) The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
14:20:20.759 | node_modules/formdata-node/lib/esm/Blob.js (7:30) The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
14:20:20.760 | node_modules/formdata-node/lib/esm/Blob.js (7:38) The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
14:20:20.764 | node_modules/formdata-node/lib/esm/File.js (1:30) The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
14:20:20.764 | node_modules/formdata-node/lib/esm/File.js (1:38) The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
14:20:20.765 | node_modules/formdata-node/lib/esm/File.js (7:30) The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
14:20:20.765 | node_modules/formdata-node/lib/esm/File.js (7:38) The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
14:20:20.773 | node_modules/form-data-encoder/lib/esm/FormDataEncoder.js (1:30) The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
14:20:20.773 | node_modules/form-data-encoder/lib/esm/FormDataEncoder.js (1:38) The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
14:20:20.773 | node_modules/form-data-encoder/lib/esm/FormDataEncoder.js (7:30) The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
14:20:20.774 | node_modules/form-data-encoder/lib/esm/FormDataEncoder.js (7:38) The 'this' keyword is equivalent to 'undefined' at the top level of an ES module, and has been rewritten
14:20:27.517 | [success] [nitro] Nitro server built
14:20:27.718 | └─ .vercel/output/functions/__nitro.func/index.mjs (1.77 MB) (391 kB gzip)
14:20:27.718 | Σ Total size: 1.77 MB (391 kB gzip)
14:20:27.858 | Build Completed in /vercel/output [19s]
14:20:27.985 | Deploying outputs...
14:20:34.764 | Deployment completed
14:20:41.160 | Uploading build cache [30.68 MB]...
14:20:42.425 | Build cache uploaded: 1.265s

<!--EndFragment-->
</body>
</html>

Logs for function:/__nitro :

AUG 20 14:21:12.11
-
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /favicon.ico
TypeError: Cannot read properties of undefined (reading 'split') at (index.mjs:8995:46) at (__nitro:middleware.js:1:17)
AUG 20 14:21:12.09
500
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /favicon.ico
[GET] /favicon.ico reason=EDGE_FUNCTION_INVOCATION_FAILED, status=500, user_error=true
AUG 20 14:21:10.03
-
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /favicon.ico
TypeError: Cannot read properties of undefined (reading 'split') at (index.mjs:8995:46) at (__nitro:middleware.js:1:17)
AUG 20 14:21:10.03
500
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /favicon.ico
[GET] /favicon.ico reason=EDGE_FUNCTION_INVOCATION_FAILED, status=500, user_error=true
AUG 20 14:21:08.87
-
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /favicon.ico
TypeError: Cannot read properties of undefined (reading 'split') at (index.mjs:8995:46) at (__nitro:middleware.js:1:17)
AUG 20 14:21:08.80
500
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /favicon.ico
[GET] /favicon.ico reason=EDGE_FUNCTION_INVOCATION_FAILED, status=500, user_error=true
AUG 20 14:21:08.15
-
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /favicon.ico
TypeError: Cannot read properties of undefined (reading 'split') at (index.mjs:8995:46) at (__nitro:middleware.js:1:17)
AUG 20 14:21:08.14
500
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /favicon.ico
[GET] /favicon.ico reason=EDGE_FUNCTION_INVOCATION_FAILED, status=500, user_error=true
AUG 20 14:21:08.01
-
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /
TypeError: Cannot read properties of undefined (reading 'split') at (index.mjs:8995:46) at (__nitro:middleware.js:1:17)
AUG 20 14:21:08.01
500
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /
[GET] / reason=EDGE_FUNCTION_INVOCATION_FAILED, status=500, user_error=true
AUG 20 14:21:07.93
-
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /
TypeError: Cannot read properties of undefined (reading 'split') at (index.mjs:8995:46) at (__nitro:middleware.js:1:17)
AUG 20 14:21:07.91
500
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /
[GET] / reason=EDGE_FUNCTION_INVOCATION_FAILED, status=500, user_error=true
AUG 20 14:20:53.38
-
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /favicon.ico
TypeError: Cannot read properties of undefined (reading 'split') at (index.mjs:8995:46) at (__nitro:middleware.js:1:17)
AUG 20 14:20:53.37
500
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /favicon.ico
[GET] /favicon.ico reason=EDGE_FUNCTION_INVOCATION_FAILED, status=500, user_error=true
AUG 20 14:20:53.14
-
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /
TypeError: Cannot read properties of undefined (reading 'split') at (index.mjs:8995:46) at (__nitro:middleware.js:1:17)
AUG 20 14:20:53.13
500
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /
[GET] / reason=EDGE_FUNCTION_INVOCATION_FAILED, status=500, user_error=true
AUG 20 14:20:43.17
-
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /favicon.ico
TypeError: Cannot read properties of undefined (reading 'split') at (index.mjs:8995:46) at (__nitro:middleware.js:1:17)
AUG 20 14:20:43.16
500
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /favicon.ico
[GET] /favicon.ico reason=EDGE_FUNCTION_INVOCATION_FAILED, status=500, user_error=true
AUG 20 14:20:42.84
-
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /
TypeError: Cannot read properties of undefined (reading 'split') at (index.mjs:8995:46) at (__nitro:middleware.js:1:17)
AUG 20 14:20:42.74
500
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /
[GET] / reason=EDGE_FUNCTION_INVOCATION_FAILED, status=500, user_error=true
AUG 20 14:20:40.17
-
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /favicon.ico
TypeError: Cannot read properties of undefined (reading 'split') at (index.mjs:8995:46) at (__nitro:middleware.js:1:17)
AUG 20 14:20:40.16
500
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /favicon.ico
[GET] /favicon.ico reason=EDGE_FUNCTION_INVOCATION_FAILED, status=500, user_error=true
AUG 20 14:20:39.92
-
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /
TypeError: Cannot read properties of undefined (reading 'split') at (index.mjs:8995:46) at (__nitro:middleware.js:1:17)
AUG 20 14:20:39.91
500
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /
[GET] / reason=EDGE_FUNCTION_INVOCATION_FAILED, status=500, user_error=true
AUG 20 14:20:39.63
-
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /
TypeError: Cannot read properties of undefined (reading 'split') at (index.mjs:8995:46) at (__nitro:middleware.js:1:17)
AUG 20 14:20:39.61
500
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /
[GET] / reason=EDGE_FUNCTION_INVOCATION_FAILED, status=500, user_error=true
AUG 20 14:20:37.48
-
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /
TypeError: Cannot read properties of undefined (reading 'split') at (index.mjs:8995:46) at (__nitro:middleware.js:1:17)
AUG 20 14:20:37.42
500
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /
[GET] / reason=EDGE_FUNCTION_INVOCATION_FAILED, status=500, user_error=true
AUG 20 14:20:37.34
-
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /
TypeError: Cannot read properties of undefined (reading 'split') at (index.mjs:8995:46) at (__nitro:middleware.js:1:17)
AUG 20 14:20:37.29
500
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /
[GET] / reason=EDGE_FUNCTION_INVOCATION_FAILED, status=500, user_error=true
AUG 20 14:20:36.28
-
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /
TypeError: Cannot read properties of undefined (reading 'split') at (index.mjs:8995:46) at (__nitro:middleware.js:1:17)
AUG 20 14:20:35.75
500
vercel-ai-chat-nuxt-openai-2dqtuctth-dosstx.vercel.app
[GET] /
[GET] / reason=EDGE_FUNCTION_INVOCATION_FAILED, status=500, user_error=true

@pi0
Copy link
Contributor

pi0 commented Aug 22, 2023

Hi! The good news it seems using the latest openai (4.0.1) the problem is resolved. (changelog is unavailable but i guess this line) fixed the issue.

I have updated my repo with it (pi0/nuxt-openai-demo@a9e4554) and it just works (demo).

@dosstx
Copy link
Contributor Author

dosstx commented Aug 22, 2023 •
edited

@pi0 I will give that a try. Is there a reason to use Vercel's AI dependency? I am confused as to whether I could just use openAI SDK for Nuxt. If Vercel has a tighter integration with Nuxt, I'm all for it!

@MaxLeiter
Copy link
Member

hey @dosstx the OpenAI SDK and the AI SDK solve different problems and can be used together. You use the OpenAI SDK to get an LLM response and the AI SDK makes it easy to stream to the client and handle things like function calls

@dosstx
Copy link
Contributor Author

dosstx commented Aug 22, 2023

You use the OpenAI SDK to get an LLM response and the AI SDK makes it easy to stream to the client and handle things like function calls

Yep, just realized that. Thanks! Sounds good, I'll be giving that a try.

@dosstx
Copy link
Contributor Author

dosstx commented Aug 23, 2023

Yes, it works. I was also able to deploy to Netlify Edge with this. Thanks!

@dosstx dosstx closed this as completed Aug 23, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
4 participants
@pi0 @dosstx @MaxLeiter @Hebilicious