# HTTP (/docs/adapters/http)



```ts
import { httpAdapter } from "@uploadcn/core"

const adapter = httpAdapter<{ id: string; url: string }>({
  url: "/api/files",
  fieldName: "file",
  fields: (item) => ({ folder: String(item.meta.folder ?? "inbox") }),
  headers: async () => ({ authorization: `Bearer ${await getToken()}` }),
})
```

Sends `multipart/form-data` by default; `body: "binary"` sends the raw file with its
MIME type (useful for `PUT` endpoints). The response is parsed as JSON when possible.

<TypeTable
  type="{
  url: { type: &#x22;string | (item) => string&#x22;, required: true },
  method: { type: '&#x22;POST&#x22; | &#x22;PUT&#x22; | &#x22;PATCH&#x22;', default: '&#x22;POST&#x22;' },
  body: { type: '&#x22;multipart&#x22; | &#x22;binary&#x22;', default: '&#x22;multipart&#x22;' },
  fieldName: { type: &#x22;string&#x22;, default: '&#x22;file&#x22;' },
  fields: { type: &#x22;Record<string, string> | (item) => Record<string, string>&#x22; },
  headers: { type: &#x22;Record<string, string> | () => Promise<Record<string, string>>&#x22; },
  withCredentials: { type: &#x22;boolean&#x22;, description: &#x22;Send cookies cross-origin.&#x22; },
  timeout: { type: &#x22;number&#x22;, description: &#x22;Milliseconds.&#x22; },
  parseResponse: { type: &#x22;(response) => TResult&#x22; },
  transport: { type: &#x22;Transport&#x22; },
}"
/>

## Example: Next.js route handler [#example-nextjs-route-handler]

```ts title="app/api/files/route.ts"
export async function POST(request: Request) {
  const form = await request.formData()
  const file = form.get("file") as File
  const url = await saveSomewhere(file)
  return Response.json({ url })
}
```

Proxying files through your server is simple but costs bandwidth and is limited by
platform body-size limits (4.5 MB on Vercel functions). Prefer
[presigned uploads](/docs/guides/presigned-uploads) for large files.
