You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: docs/api-routes/introduction.md
+5-6
Original file line number
Diff line number
Diff line change
@@ -8,7 +8,6 @@ description: Next.js supports API Routes, which allow you to build your API with
8
8
<summary><b>Examples</b></summary>
9
9
<ul>
10
10
<li><a href="https://github.com/vercel/next.js/tree/canary/examples/api-routes">Basic API Routes</a></li>
11
-
<li><a href="https://github.com/vercel/next.js/tree/canary/examples/api-routes-middleware">API Routes with middleware</a></li>
12
11
<li><a href="https://github.com/vercel/next.js/tree/canary/examples/api-routes-graphql">API Routes with GraphQL</a></li>
13
12
<li><a href="https://github.com/vercel/next.js/tree/canary/examples/api-routes-rest">API Routes with REST</a></li>
14
13
<li><a href="https://github.com/vercel/next.js/tree/canary/examples/api-routes-cors">API Routes with CORS</a></li>
@@ -31,7 +30,7 @@ export default function handler(req, res) {
31
30
32
31
For an API route to work, you need to export a function as default (a.k.a **request handler**), which then receives the following parameters:
33
32
34
-
-`req`: An instance of [http.IncomingMessage](https://nodejs.org/api/http.html#class-httpincomingmessage), plus some [pre-built middlewares](/docs/api-routes/api-middlewares.md)
33
+
-`req`: An instance of [http.IncomingMessage](https://nodejs.org/api/http.html#class-httpincomingmessage), plus some [pre-built middlewares](/docs/api-routes/request-helpers.md)
35
34
-`res`: An instance of [http.ServerResponse](https://nodejs.org/api/http.html#class-httpserverresponse), plus some [helper functions](/docs/api-routes/response-helpers.md)
36
35
37
36
To handle different HTTP methods in an API route, you can use `req.method` in your request handler, like so:
@@ -57,17 +56,17 @@ For new projects, you can build your entire API with API Routes. If you have an
57
56
58
57
## Caveats
59
58
60
-
- API Routes [do not specify CORS headers](https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS), meaning they are **same-origin only** by default. You can customize such behavior by wrapping the request handler with the [CORS middleware](/docs/api-routes/api-middlewares.md#connectexpress-middleware-support).
59
+
- API Routes [do not specify CORS headers](https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS), meaning they are **same-origin only** by default. You can customize such behavior by wrapping the request handler with the [CORS request helpers](https://github.com/vercel/next.js/tree/canary/examples/api-routes-cors).
61
60
- API Routes can't be used with [`next export`](/docs/advanced-features/static-html-export.md)
62
61
63
62
## Related
64
63
65
64
For more information on what to do next, we recommend the following sections:
66
65
67
66
<divclass="card">
68
-
<ahref="/docs/api-routes/api-middlewares.md">
69
-
<b>API Middlewares:</b>
70
-
<small>learn about the built-in middlewares for the request.</small>
67
+
<ahref="/docs/api-routes/request-helpers.md">
68
+
<b>API Routes Request Helpers:</b>
69
+
<small>learn about the built-in helpers for the request.</small>
<li><a href="https://github.com/vercel/next.js/tree/canary/examples/api-routes-cors">API Routes with CORS</a></li>
12
12
</ul>
13
13
</details>
14
14
15
-
API routes provide builtin middlewares which parse the incoming request (`req`). Those middlewares are:
15
+
API Routes provide built-in request helpers which parse the incoming request (`req`):
16
16
17
17
-`req.cookies` - An object containing the cookies sent by the request. Defaults to `{}`
18
18
-`req.query` - An object containing the [query string](https://en.wikipedia.org/wiki/Query_string). Defaults to `{}`
19
19
-`req.body` - An object containing the body parsed by `content-type`, or `null` if no body was sent
20
20
21
21
## Custom config
22
22
23
-
Every API route can export a `config` object to change the default configs, which are the following:
23
+
Every API Route can export a `config` object to change the default configuration, which is the following:
24
24
25
25
```js
26
26
exportconstconfig= {
@@ -32,7 +32,7 @@ export const config = {
32
32
}
33
33
```
34
34
35
-
The `api` object includes all configs available for API routes.
35
+
The `api` object includes all config options available for API Routes.
36
36
37
37
`bodyParser` is automatically enabled. If you want to consume the body as a `Stream` or with [`raw-body`](https://www.npmjs.com/package/raw-body), you can set this to `false`.
38
38
@@ -68,7 +68,7 @@ export const config = {
68
68
}
69
69
```
70
70
71
-
`responseLimit` is automatically enabled, warning when an API routes' response body is over 4MB.
71
+
`responseLimit` is automatically enabled, warning when an API Routes' response body is over 4MB.
72
72
73
73
If you are not using Next.js in a serverless environment, and understand the performance implications of not using a CDN or dedicated media host, you can set this limit to `false`.
74
74
@@ -91,57 +91,6 @@ export const config = {
91
91
}
92
92
```
93
93
94
-
## Connect/Express middleware support
95
-
96
-
You can also use [Connect](https://github.com/senchalabs/connect) compatible middleware.
97
-
98
-
For example, [configuring CORS](https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS) for your API endpoint can be done leveraging the [cors](https://www.npmjs.com/package/cors) package.
99
-
100
-
First, install `cors`:
101
-
102
-
```bash
103
-
npm i cors
104
-
# or
105
-
yarn add cors
106
-
```
107
-
108
-
Now, let's add `cors` to the API route:
109
-
110
-
```js
111
-
importCorsfrom'cors'
112
-
113
-
// Initializing the cors middleware
114
-
constcors=Cors({
115
-
methods: ['GET', 'HEAD'],
116
-
})
117
-
118
-
// Helper method to wait for a middleware to execute before continuing
119
-
// And to throw an error when an error happens in a middleware
120
-
functionrunMiddleware(req, res, fn) {
121
-
returnnewPromise((resolve, reject) => {
122
-
fn(req, res, (result) => {
123
-
if (result instanceofError) {
124
-
returnreject(result)
125
-
}
126
-
127
-
returnresolve(result)
128
-
})
129
-
})
130
-
}
131
-
132
-
asyncfunctionhandler(req, res) {
133
-
// Run the middleware
134
-
awaitrunMiddleware(req, res, cors)
135
-
136
-
// Rest of the API logic
137
-
res.json({ message:'Hello Everyone!' })
138
-
}
139
-
140
-
exportdefaulthandler
141
-
```
142
-
143
-
> Go to the [API Routes with CORS](https://github.com/vercel/next.js/tree/canary/examples/api-routes-cors) example to see the finished app.
144
-
145
94
## Extending the `req`/`res` objects with TypeScript
146
95
147
96
For better type-safety, it is not recommended to extend the `req` and `res` objects. Instead, use functions to work with them:
Copy file name to clipboardExpand all lines: docs/api-routes/response-helpers.md
+1-1
Original file line number
Diff line number
Diff line change
@@ -2,7 +2,7 @@
2
2
description: API Routes include a set of Express.js-like methods for the response to help you creating new API endpoints. Learn how it works here.
3
3
---
4
4
5
-
# Response Helpers
5
+
# API Routes Response Helpers
6
6
7
7
The [Server Response object](https://nodejs.org/api/http.html#http_class_http_serverresponse), (often abbreviated as `res`) includes a set of Express.js-like helper methods to improve the developer experience and increase the speed of creating new API endpoints.
0 commit comments