Nuxt/docs/content/3.docs/2.directory-structure/13.server.md

108 lines
2.7 KiB
Markdown
Raw Normal View History

---
icon: IconDirectory
title: server
head.title: Server directory
---
# Server directory
Nuxt uses the `server/` directory to create any backend logic for your application. It supports HMR and powerful features.
2021-10-11 22:47:43 +00:00
The `server/` directory contains API endpoints and server middleware for your project.
## API Routes
Nuxt will automatically read in any files in the `~/server/api` directory to create API endpoints.
2021-11-21 12:31:44 +00:00
Each file should export a default function that handles API requests. It can return a promise or JSON data directly (or use `res.end()`).
### Examples
#### Hello world
```js [server/api/hello.ts]
export default (req, res) => 'Hello World'
```
2021-11-21 12:31:44 +00:00
See the result on <http://localhost:3000/api/hello>.
#### Async function
```js [server/api/async.ts]
export default async (req, res) => {
await someAsyncFunction()
return {
someData: true
}
}
```
**Example:** Using Node.js style
```ts [server/api/node.ts]
import type { IncomingMessage, ServerResponse } from 'http'
export default async (req: IncomingMessage, res: ServerResponse) => {
res.statusCode = 200
res.end('Works!')
}
```
#### Accessing req data
```js
import { useBody, useCookies, useQuery } from 'h3'
export default async (req, res) => {
const query = useQuery(req)
const body = await useBody(req) // only for POST request
const cookies = useCookies(req)
return { query, body, cookies }
}
```
Learn more about [h3 methods](https://www.jsdocs.io/package/h3#package-index-functions).
## Server Middleware
Nuxt will automatically read in any files in the `~/server/middleware` to create server middleware for your project.
These files will be run on every request, unlike [API routes](#api-routes) that are mapped to their own routes. This is typically so you can add a common header to all responses, log responses or modify the incoming request object for later use in the request chain.
Each file should export a default function that will handle a request.
```js
export default async (req, res) => {
req.someValue = true
}
```
There is nothing different about the `req`/`res` objects, so typing them is straightforward.
```ts
import type { IncomingMessage, ServerResponse } from 'http'
export default async (req: IncomingMessage, res: ServerResponse) => {
req.someValue = true
}
```
To pass the request deeper into the application, you can `return` inside the function:
```js
export default async (req, res) => {
const isNotHandledByThisMiddleware = req.url.includes('/some-unhandled-url-path/')
if(isNotHandledByThisMiddleware) {
return
}
// Actual logic here
}
```
::alert{type=info icon=🔎}
Find more information about custom middleware in the documentation for [nuxt.config.js](/docs/directory-structure/nuxt.config#servermiddleware)
::