Add a Middleware to a Next.js API Route
In this lesson, you're going to learn how to create a Middleware that checks for the existence of an Authentication header. If that header doesn't exist, we'll terminate the request and let it continue if it does. We'll abstract that functionality in a middleware so we can reuse it in other API routes.
Instructor: [0:00] Let's create a testing middleware API route, to test this out. Let's begin by creating a function called handler() that has a request and a response. Let's export that function as the default export for this API route. Let's return a response that has a status of 200. This returns a JSON with a message "OK."
[0:35] Let's try this out to see that it is working. Yes, indeed, it is working. We check if the request headers contains an authentication header. If it doesn't, then we can return a 401, a JSON that says message "Error." Let's test this out. We do the same request that we did before. Now we see that we get back a 401 and a message that says Error.
[1:15] Let's create a function that is called withAuthentication(). This will receive a handler function. This function also returns a function that accepts our requests, no response. We are going to grab what we have in the handler, and we're going to paste it here. Lastly, we're going to return a handler function with request and a response.
[1:52] Let's wrap the default export with withAuthentication. We're going to pass the handler function to it. Let's go over the input again. This middleware, this returns an error with a 401. All right. Now, we're going to call the same endpoint, but we're going to pass authentication header and we're going to set it to true.
[2:14] It doesn't matter in the end. We're just checking that we have that header present. It works. We're getting back a 200 and the OK message.
[2:26] To recap, in order to create a middleware for a Next.js API route, we have to create a function that returns a function. The first function will receive the handler, which is the one that we created above. The second function will have a request and a response. Then, we do whatever we want.
[2:47] In this case, we're going to check the authentication header, and we'll return the response. If not, we let the request continue its natural course. The last thing that we have to do is we have to wrap the handler function with the middleware.
Member comments are a way for members to communicate, interact, and ask questions about a lesson.
The instructor or someone from the community might respond to your question Here are a few basic guidelines to commenting on egghead.io
Be on-Topic
Comments are for discussing a lesson. If you're having a general issue with the website functionality, please contact us at support@egghead.io.
Avoid meta-discussion
Code Problems?
Should be accompanied by code! Codesandbox or Stackblitz provide a way to share code and discuss it in context
Details and Context
Vague question? Vague answer. Any details and context you can provide will lure more interesting answers!