diff --git a/README.md b/README.md index c3edb9f..f2dd092 100644 --- a/README.md +++ b/README.md @@ -10,7 +10,7 @@ pairing with smart people at Hashrocket. For a steady stream of TILs, [sign up for my newsletter](https://crafty-builder-6996.ck.page/e169c61186). -_1398 TILs and counting..._ +_1399 TILs and counting..._ --- @@ -621,6 +621,7 @@ _1398 TILs and counting..._ - [Create Files And Directories For Dynamic Routes](nextjs/create-files-and-directories-for-dynamic-routes.md) - [Define URL Redirects In The Next Config](nextjs/define-url-redirects-in-the-next-config.md) +- [Fetch Does Not Work In API Serverless Function](nextjs/fetch-does-not-work-in-api-serverless-function.md) - [Make Environment Variable Publicly Available](nextjs/make-environment-variable-publicly-available.md) - [Match Middleware On Groups Of Paths](nextjs/match-middleware-on-groups-of-paths.md) - [Push A Route With A URL Object](nextjs/push-a-route-with-a-url-object.md) diff --git a/nextjs/fetch-does-not-work-in-api-serverless-function.md b/nextjs/fetch-does-not-work-in-api-serverless-function.md new file mode 100644 index 0000000..066018b --- /dev/null +++ b/nextjs/fetch-does-not-work-in-api-serverless-function.md @@ -0,0 +1,24 @@ +# Fetch Does Not Work In API Serverless Function + +Next.js ships with [its own implementation of +`fetch`](https://nextjs.org/docs/app/api-reference/functions/fetch) that +extends the [native `fetch` +API](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API). + +I ran into a bug recently that was only reproducible in production. I had a +Next.js API function that was `POST`ing to another API endpoint using `fetch`. +I tested it several ways in development. It worked great. However, once the +feature was in production, it was silently failing. After some `console.log` +debugging, I discovered that the target API was getting an empty `body` in the +`POST` request. + +I don't know the specifics of why, but somehow the `fetch` implementation +running in the Vercel serverless function environment apparently strips out the +`body` of a POST request. + +The solution, for me, was to add the +[`node-fetch`](https://github.com/node-fetch/node-fetch) package and import +that version of fetch in my API function. Once I made that change, my feature +was working again. + +[source](https://github.com/vercel/vercel/discussions/4971)