Skip to content

Parameters

We need to send a payload to server eventaully.

To handle this, Eden Treaty's methods accept 2 parameters to send data to server.

Both parameters is type safe and will be guided by TypeScript automatically:

  1. body
  2. additional parameters
    • query
    • headers
    • fetch
typescript
import { 
Elysia
,
t
} from 'elysia'
import {
treaty
} from '@elysiajs/eden'
const
app
= new
Elysia
()
.
post
('/user', ({
body
}) =>
body
, {
body
:
t
.
Object
({
name
:
t
.
String
()
}) }) .
listen
(3000)
const
api
=
treaty
<typeof
app
>('localhost:3000')
// ✅ works
api
.
user
.
post
({
name
: 'Elysia'
}) // ✅ also works
api
.
user
.
post
({
name
: 'Elysia'
}, { // This is optional as not specified in schema
headers
: {
authorization
: 'Bearer 12345'
},
query
: {
id
: 2
} })

Unless if the method doesn't accept body, then body will be omitted and left with single parameter only.

If the method "GET" or "HEAD":

  1. Additional parameters
    • query
    • headers
    • fetch
typescript
import { 
Elysia
} from 'elysia'
import {
treaty
} from '@elysiajs/eden'
const
app
= new
Elysia
()
.
get
('/hello', () => 'hi')
.
listen
(3000)
const
api
=
treaty
<typeof
app
>('localhost:3000')
// ✅ works
api
.
hello
.
get
({
// This is optional as not specified in schema
headers
: {
hello
: 'world'
} })

Empty body

If body is optional or not need but query or headers is required, you may pass the body as null or undefined instead.

typescript
import { 
Elysia
,
t
} from 'elysia'
import {
treaty
} from '@elysiajs/eden'
const
app
= new
Elysia
()
.
post
('/user', () => 'hi', {
query
:
t
.
Object
({
name
:
t
.
String
()
}) }) .
listen
(3000)
const
api
=
treaty
<typeof
app
>('localhost:3000')
api
.
user
.
post
(null, {
query
: {
name
: 'Ely'
} })

Fetch parameters

Eden Treaty is a fetch wrapper, we may add any valid Fetch parameters to Eden by passing it to $fetch:

typescript
import { 
Elysia
,
t
} from 'elysia'
import {
treaty
} from '@elysiajs/eden'
const
app
= new
Elysia
()
.
get
('/hello', () => 'hi')
.
listen
(3000)
const
api
=
treaty
<typeof
app
>('localhost:3000')
const
controller
= new
AbortController
()
const
cancelRequest
=
setTimeout
(() => {
controller
.
abort
()
}, 5000) await
api
.
hello
.
get
({
fetch
: {
signal
:
controller
.
signal
} })
clearTimeout
(
cancelRequest
)

File Upload

We may either pass one of the following to attach file(s):

  • File
  • File[]
  • FileList
  • Blob

Attaching a file will results content-type to be multipart/form-data

Suppose we have the server as the following:

typescript
import { 
Elysia
,
t
} from 'elysia'
import {
treaty
} from '@elysiajs/eden'
const
app
= new
Elysia
()
.
post
('/image', ({
body
: {
image
,
title
} }) =>
title
, {
body
:
t
.
Object
({
title
:
t
.
String
(),
image
:
t
.
Files
()
}) }) .
listen
(3000)
export const
api
=
treaty
<typeof
app
>('localhost:3000')
const
images
=
document
.
getElementById
('images') as HTMLInputElement
const {
data
} = await
api
.
image
.
post
({
title
: "Misono Mika",
image
:
images
.
files
!,
})