mirror of
https://github.com/ArthurDanjou/trpc-nuxt.git
synced 2026-01-27 02:10:35 +01:00
docs: improve docs
This commit is contained in:
58
docs/content/1.get-started/3.client/2.links/1.httpLink.md
Normal file
58
docs/content/1.get-started/3.client/2.links/1.httpLink.md
Normal file
@@ -0,0 +1,58 @@
|
||||
---
|
||||
title: HTTP Link
|
||||
description: httpLink is a terminating link that sends a tRPC operation to a tRPC procedure over HTTP.
|
||||
---
|
||||
|
||||
# HTTP Link
|
||||
|
||||
`httpLink` is a [terminating link](https://trpc.io/docs/links#the-terminating-link) that sends a tRPC operation to a tRPC procedure over HTTP.
|
||||
|
||||
`httpLink` supports both POST and GET requests.
|
||||
|
||||
::alert{type="info"}
|
||||
`httpLink` imported from `trpc-nuxt/client` is a convenience wrapper around the original `httpLink` that replaces regular `fetch` with a [`$fetch`](https://nuxt.com/docs/api/utils/dollarfetch) from Nuxt. It also sets the default headers using [`useRequestHeaders`](https://nuxt.com/docs/api/composables/use-request-headers#userequestheaders).
|
||||
::
|
||||
|
||||
## Usage
|
||||
|
||||
You can import and add the `httpLink` to the `links` array as such:
|
||||
|
||||
```ts
|
||||
import { createTRPCNuxtClient, httpLink } from 'trpc-nuxt/client'
|
||||
import type { AppRouter } from '~/server/trpc/routers'
|
||||
|
||||
const client = createTRPCNuxtClient<AppRouter>({
|
||||
links: [
|
||||
httpLink({
|
||||
url: '/api/trpc',
|
||||
}),
|
||||
],
|
||||
})
|
||||
```
|
||||
|
||||
## `httpLink` Options
|
||||
|
||||
The `httpLink` function takes an options object that has the `HTTPLinkOptions` shape.
|
||||
|
||||
```ts
|
||||
export interface HTTPLinkOptions {
|
||||
url: string;
|
||||
/**
|
||||
* Select headers to pass to `useRequestHeaders`.
|
||||
*/
|
||||
pickHeaders?: string[];
|
||||
/**
|
||||
* Add ponyfill for fetch.
|
||||
*/
|
||||
fetch?: typeof fetch;
|
||||
/**
|
||||
* Add ponyfill for AbortController
|
||||
*/
|
||||
AbortController?: typeof AbortController | null;
|
||||
/**
|
||||
* Headers to be set on outgoing requests or a callback that of said headers
|
||||
* @link http://trpc.io/docs/v10/header
|
||||
*/
|
||||
headers?: HTTPHeaders | (() => HTTPHeaders | Promise<HTTPHeaders>);
|
||||
}
|
||||
```
|
||||
Reference in New Issue
Block a user