Python Serverless Function Vercel - Next.js

Question

I found out that I could use Python to create a serverless function inside a Next.js project. Once deployed to Vercel, it will get converted into a serverless function.

I went through the docs and found a simple example that outputs the date:

from http.server import BaseHTTPRequestHandler
from datetime import datetime

class handler(BaseHTTPRequestHandler):

  def do_GET(self):
    self.send_response(200)
    self.send_header('Content-type', 'text/plain')
    self.end_headers()
    self.wfile.write(str(datetime.now().strftime('%Y-%m-%d %H:%M:%S')).encode())
    return

They offer a live working example here.

Apparently all that is needed is to place the file date.py inside the api folder of a bootstrapped Next.js project and you're off to the races. When deployed, Vercel will detect the Python file and serve it as a serverless function.

The deploy succeeded and I placed the file inside the pages/api folder as required. However, the function is never picked up (image below):

Older versions apparently required the configuration of serverless functions by adding a vercel.json file. But this doesn't seem necessary now.

What am I missing?

if you are putting the api folder inside pages folder try moving it outside of it — evgeni fotia, Aug 30 '20 at 12:50
@evgenifotia when you generate a new app with [`create-next-app`](https://nextjs.org/docs/getting-started) it automatically creates an `api` folder inside `pages`. — Juan Marco, Aug 30 '20 at 14:05

Juan Marco · Accepted Answer · 2020-09-05T16:18:53.407

14

After going over the FAQs. I found an entry named Unmatched Function Pattern, it states:

the functions property uses a glob pattern for each key. This pattern must match Serverless Function source files within the api directory.

It also mentions:

if you'd like to use a Serverless Function that isn't written with Node.js in combination with Next.js, you can place it in the api directory (provided by the platform), since pages/api (provided by Next.js) only supports JavaScript.

I think that this needs to be clarified a bit. There is indeed an default api folder when you bootstrap a Next.js project with create-next-app, but it's created inside the pages directory.

If you follow the example they give, you might just go ahead and create a serverless function in a supported language (other than JavaScript) inside the pages/api directory and wonder why Vercel doesn't pick it up when you deploy.

In short, if you're using another language to write a serverless function inside a Next.js project. Be sure to place it inside an api folder that sits in the root directory of the project (if there's none, create one).

Thanks to @evgenifotia for the suggestion, it pointed me in the right direction and helped me solve this issue.

Note: You can only have a single api directory that houses serverless functions. Either you have a pages/api directory or a api directory in the root folder, having both in a single project is not supported.

edited Sep 05 '20 at 16:18

answered Aug 30 '20 at 16:36

Juan Marco

3,081
2
28
32

In this case will the regular nodejs functions continue to work? – manu Nov 30 '20 at 00:33
1

The Node.js functions will work inside a `api` directory located inside `pages` or outside of it as well. – Juan Marco Nov 30 '20 at 01:32
Sorry, my goal is to use both nodejs and python functions in one project. Should I just put all of them in parent `api` folder or can I have one `api` and another `pages/api` folder? – manu Dec 01 '20 at 06:59
6

Have a single `api` folder in the root of the project. That way you can use Node.js and Python functions. – Juan Marco Dec 01 '20 at 12:29
hey @JuanMarco first, thank you your post has been very helpful; what do you change in the next config to remap the api on root/api instead of the default pages/api folder ? – Stormsson Apr 15 '23 at 15:47
@Stormsson there should be no changes in the config, just replace `pages/api` with `api` in the root folder of the project. – Juan Marco Apr 21 '23 at 07:08
I had a chat with Vercel support, and actually reproduced what my issue was; It's now possible to have both /root/api for python & /root/pages/api , the important part was to correctly configure vercel.json so that you can have a logic to identify if the request is for python or nextjs; i personally used a prefix and everything sent with /p/ gets routed to py , and the rest is handled by nextjs – Stormsson Apr 21 '23 at 18:50

Python Serverless Function Vercel - Next.js

1 Answers1

Linked