# next-api-route-middleware
> Middleware for nextjs api routes
Latest version **1.0.2** (published 2022-08-29) · MIT license · 0 weekly downloads
## Install
```sh
npm install next-api-route-middleware
pnpm add next-api-route-middleware
yarn add next-api-route-middleware
bun add next-api-route-middleware
```
## Health
**Score 25/100 (F)** — status: abandoned.
Positive: has types; esm support; no vulnerabilities.
Warnings: low downloads.
Negative: abandoned; low maintenance score.
## Facts
| | |
|---|---|
| Version | 1.0.2 |
| Published | 2022-08-29 |
| First published | 2022-08-28 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM |
| Dependencies | 0 |
| Unpacked size | 7.1 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 36 |
| Author | kolbysisk |
| Maintainers | kolbysisk |
## Links
- npm: https://www.npmjs.com/package/next-api-route-middleware
- Repository: https://github.com/KolbySisk/next-api-route-middleware
- Homepage: https://github.com/KolbySisk/next-api-route-middleware#readme
- Issues: https://github.com/KolbySisk/next-api-route-middleware/issues
- npm.io page: https://npm.io/package/next-api-route-middleware
## Recent versions
- 1.0.2 (latest) — 2022-08-29
- 1.0.1 — 2022-08-28
- 1.0.0 — 2022-08-28
## README
Next-api-route-middleware
Middleware for Next.js api routes
## Introduction
Middleware functions allows us to abstract reusable code that runs before the api handler is invoked. They have access to the `req`, `res`, and the `next` middleware function.
##### Example uses:
- Add data to the `req` object _(without TypeScript complaining!)_
- Reject wrong request methods
- Capture errors
- Validate body/query data
## Getting started
##### 1. Install'r
`npm i next-api-route-middleware`
##### 2. Create your middleware
Your middleware is a function that accepts `req`, `res`, and `next`. It should call `next()` when done, or send a response.
```ts
export type NextApiRequestWithUser = NextApiRequest & User;
export const withUser: Middleware = async (req, res, next) => {
const authCookie = await getUserByCookie();
if (authCookie) {
req.userId = authCookie.userId;
next();
} else {
res.status(401).send({ message: 'Invalid auth cookie.' });
}
};
```
##### 3. Export the `use` function. Include an array of middlewares in the order you want them to execute, along with your handler as the last item in the array.
```ts
import { use } from 'next-api-route-middleware';
const handler = async (req: NextApiRequestWithUser, res: NextApiResponse) => {
res.status(200).json({ userId: req.userId });
};
export default use(captureErrors, allowMethods(['GET']), addhUser, handler);
```
## Examples
#### addUser
You can add data to the `req` object, and it will be available in your handler. In this example we get a userId from an http cookie, if the cookie isn't valid we return a 401.
```ts
export const addUser: Middleware = async (req, res, next) => {
const authCookie = await getUserByCookie();
if (authCookie) {
req.userId = authCookie.userId;
next();
} else {
res.status(401).send({ message: 'Invalid auth cookie.' });
}
};
```
#### allowMethods
You may find that you need to add args to a middleware. To achieve this we make use of a factory pattern. The `allowMethods` function bellow accepts an array of allowed methods, and returns a middleware. We can make use of this factory by calling the function: `allowMethods(['GET', 'POST'])`
```ts
import { Middleware } from 'next-api-route-middleware';
export const allowMethods = (allowedMethods: string[]): Middleware => {
return async function (req, res, next) {
if (allowedMethods.includes(req.method!) || req.method == 'OPTIONS') {
next();
} else {
res.status(405).send({ message: 'Method not allowed.' });
}
};
};
```
#### captureErrors
We can also perform actions with inner middleware functions. In this example we wrap the inner middleware functions in a try catch, allowing us to catch any errors that bubble up.
```ts
import { Middleware } from 'next-api-route-middleware';
export const captureErrors: Middleware = async (req, res, next) => {
try {
await next();
} catch (error) {
console.error(error);
res.status(500).send({ message: 'Server error!' });
}
};
```
---
_Source: https://npm.io/package/next-api-route-middleware · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._