A typed fetch client for openapi-typescript
npm install openapi-typescript-fetch

A typed fetch client for openapi-typescript
``bash`
npm install openapi-typescript-fetch`
Orbash`
yarn add openapi-typescript-fetch
Features
Supports JSON request and responses
- β
OpenAPI 3.0
- β
Swagger 2.0
Generate typescript definition from schema
`bash
npx openapi-typescript https://petstore.swagger.io/v2/swagger.json --output petstore.ts
Typed fetch client
`ts
import { Fetcher } from 'openapi-typescript-fetch'import { paths } from './petstore'
// declare fetcher for paths
const fetcher = Fetcher.for()
// global configuration
fetcher.configure({
baseUrl: 'https://petstore.swagger.io/v2',
init: {
headers: {
...
},
},
use: [...] // middlewares
})
// create fetch operations
const findPetsByStatus = fetcher.path('/pet/findByStatus').method('get').create()
const addPet = fetcher.path('/pet').method('post').create()
// fetch
const { status, data: pets } = await findPetsByStatus({
status: ['available', 'pending'],
})
console.log(pets[0])
`$3
A non-ok fetch response throws a generic
ApiErrorBut an Openapi document can declare a different response type for each status code, or a default error response type
These can be accessed via a
discriminated union on status, as in code snippet below`ts
const findPetsByStatus = fetcher.path('/pet/findByStatus').method('get').create()
const addPet = fetcher.path('/pet').method('post').create()try {
await findPetsByStatus({ ... })
await addPet({ ... })
} catch(e) {
// check which operation threw the exception
if (e instanceof addPet.Error) {
// get discriminated union { status, data }
const error = e.getActualType()
if (error.status === 400) {
error.data.validationErrors // only available for a 400 response
} else if (error.status === 500) {
error.data.errorMessage // only available for a 500 response
} else {
...
}
}
}
`$3
Middlewares can be used to pre and post process fetch operations (log api calls, add auth headers etc)
`tsimport { Middleware } from 'openapi-typescript-fetch'
const logger: Middleware = async (url, init, next) => {
console.log(
fetching ${url})
const response = await next(url, init)
console.log(fetched ${url})
return response
}fetcher.configure({
baseUrl: 'https://petstore.swagger.io/v2',
init: { ... },
use: [logger],
})
// or
fetcher.use(logger)
`$3
-
OpArgType - Infer argument type of an operation
- OpReturnType - Infer return type of an operation
- OpErrorType - Infer error type of an operation
- FetchArgType - Argument type of a typed fetch operation
- FetchReturnType - Return type of a typed fetch operation
- FetchErrorType - Error type of a typed fetch operation
- TypedFetch - Fetch operation type`ts
import { paths, operations } from './petstore'type Arg = OpArgType
type Ret = OpReturnType
type Err = OpErrorType
type Arg = OpArgType
type Ret = OpReturnType
type Err = OpErrorType
type FindPetsByStatus = TypedFetch
const findPetsByStatus = fetcher.path('/pet/findByStatus').method('get').create()
type Arg = FetchArgType
type Ret = FetchReturnType
type Err = FetchErrorType
`$3
-
arrayRequestBody - Helper to merge params when request body is an array see issue`tsconst body = arrayRequestBody([{ item: 1}], { param: 2})
// body type is { item: number }[] & { param: number }
`$3
The baseUrl can be configured with a function that returns the url at runtime
`ts
fetcher.configure({
baseUrl: () => getBaseUrl(...)
})
`It can also be overriden per method invocation
`ts
await findPetsByStatus(
{ status: ['available', 'pending'] },
{ baseUrl: "https://staging.petstore.swagger.io/v2" }
)
``Happy fetching! π