When sending REST API requests with multipart/form-data, e.g. PATCH or POST within the admin panel, a request body larger than 1MB throws the following error: ``` Unterminated string in JSON at position... ``` This is because there are sensible defaults imposed by the HTML form data parser (currently using [busboy](https://github.com/fastify/busboy)). If your documents exceed this limit, you may run into this error when editing them within the admin panel. To support large documents over 1MB, use the new `bodyParser` property on the root config: ```ts import { buildConfig } from 'payload' const config = buildConfig({ // ... bodyParser: { limits: { fieldSize: 2 * 1024 * 1024, // This will allow requests containing up to 2MB of multipart/form-data } } } ``` --- - To see the specific tasks where the Asana app for GitHub is being used, see below: - https://app.asana.com/0/0/1211317005907885
257 lines
7.1 KiB
TypeScript
257 lines
7.1 KiB
TypeScript
import type { JoinQuery, PopulateType, SanitizedConfig, SelectType, Where } from 'payload'
|
|
import type { ParsedQs } from 'qs-esm'
|
|
|
|
import {
|
|
REST_DELETE as createDELETE,
|
|
REST_GET as createGET,
|
|
GRAPHQL_POST as createGraphqlPOST,
|
|
REST_PATCH as createPATCH,
|
|
REST_POST as createPOST,
|
|
REST_PUT as createPUT,
|
|
} from '@payloadcms/next/routes'
|
|
import * as qs from 'qs-esm'
|
|
|
|
import { devUser } from '../credentials.js'
|
|
import { getFormDataSize } from './getFormDataSize.js'
|
|
|
|
type ValidPath = `/${string}`
|
|
type RequestOptions = {
|
|
auth?: boolean
|
|
query?: { [key: string]: unknown } & {
|
|
depth?: number
|
|
fallbackLocale?: string
|
|
joins?: JoinQuery
|
|
limit?: number
|
|
locale?: string
|
|
page?: number
|
|
populate?: PopulateType
|
|
select?: SelectType
|
|
sort?: string
|
|
where?: Where
|
|
}
|
|
}
|
|
|
|
type FileArg = {
|
|
file?: Omit<File, 'webkitRelativePath'>
|
|
}
|
|
|
|
function generateQueryString(query: RequestOptions['query'], params: ParsedQs): string {
|
|
return qs.stringify(
|
|
{
|
|
...(params || {}),
|
|
...(query || {}),
|
|
},
|
|
{
|
|
addQueryPrefix: true,
|
|
},
|
|
)
|
|
}
|
|
|
|
export class NextRESTClient {
|
|
private _DELETE: (
|
|
request: Request,
|
|
args: { params: Promise<{ slug: string[] }> },
|
|
) => Promise<Response>
|
|
|
|
private _GET: (
|
|
request: Request,
|
|
args: { params: Promise<{ slug: string[] }> },
|
|
) => Promise<Response>
|
|
|
|
private _GRAPHQL_POST: (request: Request) => Promise<Response>
|
|
|
|
private _PATCH: (
|
|
request: Request,
|
|
args: { params: Promise<{ slug: string[] }> },
|
|
) => Promise<Response>
|
|
|
|
private _POST: (
|
|
request: Request,
|
|
args: { params: Promise<{ slug: string[] }> },
|
|
) => Promise<Response>
|
|
|
|
private _PUT: (
|
|
request: Request,
|
|
args: { params: Promise<{ slug: string[] }> },
|
|
) => Promise<Response>
|
|
|
|
private readonly config: SanitizedConfig
|
|
|
|
private token: string
|
|
|
|
serverURL: string = 'http://localhost:3000'
|
|
|
|
constructor(config: SanitizedConfig) {
|
|
this.config = config
|
|
if (config?.serverURL) {
|
|
this.serverURL = config.serverURL
|
|
}
|
|
this._GET = createGET(config)
|
|
this._POST = createPOST(config)
|
|
this._DELETE = createDELETE(config)
|
|
this._PATCH = createPATCH(config)
|
|
this._PUT = createPUT(config)
|
|
this._GRAPHQL_POST = createGraphqlPOST(config)
|
|
}
|
|
|
|
private buildHeaders(options: FileArg & RequestInit & RequestOptions): Headers {
|
|
// Only set `Content-Type` to `application/json` if body is not `FormData`
|
|
const isFormData =
|
|
options &&
|
|
typeof options.body !== 'undefined' &&
|
|
typeof FormData !== 'undefined' &&
|
|
options.body instanceof FormData
|
|
|
|
const headers = new Headers(options.headers || {})
|
|
|
|
if (options?.file) {
|
|
headers.set('Content-Length', options.file.size.toString())
|
|
}
|
|
|
|
if (isFormData) {
|
|
headers.set('Content-Length', getFormDataSize(options.body as FormData).toString())
|
|
}
|
|
|
|
if (!isFormData && !headers.has('Content-Type')) {
|
|
headers.set('Content-Type', 'application/json')
|
|
}
|
|
|
|
if (options.auth !== false && this.token) {
|
|
headers.set('Authorization', `JWT ${this.token}`)
|
|
}
|
|
if (options.auth === false) {
|
|
headers.set('DisableAutologin', 'true')
|
|
}
|
|
|
|
return headers
|
|
}
|
|
|
|
private generateRequestParts(path: ValidPath): {
|
|
params?: ParsedQs
|
|
slug: string[]
|
|
url: string
|
|
} {
|
|
const [slugs, params] = path.slice(1).split('?')
|
|
const url = `${this.serverURL}${this.config.routes.api}/${slugs}`
|
|
|
|
return {
|
|
slug: slugs.split('/'),
|
|
params: params ? qs.parse(params) : undefined,
|
|
url,
|
|
}
|
|
}
|
|
|
|
async DELETE(path: ValidPath, options: RequestInit & RequestOptions = {}): Promise<Response> {
|
|
const { slug, params, url } = this.generateRequestParts(path)
|
|
const { query, ...rest } = options || {}
|
|
const queryParams = generateQueryString(query, params)
|
|
|
|
const request = new Request(`${url}${queryParams}`, {
|
|
...rest,
|
|
headers: this.buildHeaders(options),
|
|
method: 'DELETE',
|
|
})
|
|
return this._DELETE(request, { params: Promise.resolve({ slug }) })
|
|
}
|
|
|
|
async GET(
|
|
path: ValidPath,
|
|
options: Omit<RequestInit, 'body'> & RequestOptions = {},
|
|
): Promise<Response> {
|
|
const { slug, params, url } = this.generateRequestParts(path)
|
|
const { query, ...rest } = options || {}
|
|
const queryParams = generateQueryString(query, params)
|
|
|
|
const request = new Request(`${url}${queryParams}`, {
|
|
...rest,
|
|
headers: this.buildHeaders(options),
|
|
method: 'GET',
|
|
})
|
|
return this._GET(request, { params: Promise.resolve({ slug }) })
|
|
}
|
|
|
|
async GRAPHQL_POST(options: RequestInit & RequestOptions): Promise<Response> {
|
|
const { query, ...rest } = options
|
|
const queryParams = generateQueryString(query, {})
|
|
const request = new Request(
|
|
`${this.serverURL}${this.config.routes.api}${this.config.routes.graphQL}${queryParams}`,
|
|
{
|
|
...rest,
|
|
headers: this.buildHeaders(options),
|
|
method: 'POST',
|
|
},
|
|
)
|
|
return this._GRAPHQL_POST(request)
|
|
}
|
|
|
|
async login({
|
|
slug,
|
|
credentials,
|
|
}: {
|
|
credentials?: {
|
|
email: string
|
|
password: string
|
|
}
|
|
slug: string
|
|
}): Promise<{ [key: string]: any }> {
|
|
const response = await this.POST(`/${slug}/login`, {
|
|
body: JSON.stringify(
|
|
credentials ? { ...credentials } : { email: devUser.email, password: devUser.password },
|
|
),
|
|
})
|
|
const result = await response.json()
|
|
|
|
this.token = result.token
|
|
|
|
if (!result.token) {
|
|
// If the token is not in the response body, then we can extract it from the cookies
|
|
const setCookie = response.headers.get('Set-Cookie')
|
|
const tokenMatchResult = setCookie?.match(/payload-token=(?<token>.+?);/)
|
|
this.token = tokenMatchResult?.groups?.token
|
|
}
|
|
|
|
return result
|
|
}
|
|
|
|
async PATCH(path: ValidPath, options: FileArg & RequestInit & RequestOptions): Promise<Response> {
|
|
const { slug, params, url } = this.generateRequestParts(path)
|
|
const { query, ...rest } = options
|
|
const queryParams = generateQueryString(query, params)
|
|
|
|
const request = new Request(`${url}${queryParams}`, {
|
|
...rest,
|
|
headers: this.buildHeaders(options),
|
|
method: 'PATCH',
|
|
})
|
|
|
|
return this._PATCH(request, { params: Promise.resolve({ slug }) })
|
|
}
|
|
|
|
async POST(
|
|
path: ValidPath,
|
|
options: FileArg & RequestInit & RequestOptions = {},
|
|
): Promise<Response> {
|
|
const { slug, params, url } = this.generateRequestParts(path)
|
|
const queryParams = generateQueryString({}, params)
|
|
const request = new Request(`${url}${queryParams}`, {
|
|
...options,
|
|
headers: this.buildHeaders(options),
|
|
method: 'POST',
|
|
})
|
|
return this._POST(request, { params: Promise.resolve({ slug }) })
|
|
}
|
|
|
|
async PUT(path: ValidPath, options: FileArg & RequestInit & RequestOptions): Promise<Response> {
|
|
const { slug, params, url } = this.generateRequestParts(path)
|
|
const { query, ...rest } = options
|
|
const queryParams = generateQueryString(query, params)
|
|
|
|
const request = new Request(`${url}${queryParams}`, {
|
|
...rest,
|
|
headers: this.buildHeaders(options),
|
|
method: 'PUT',
|
|
})
|
|
return this._PUT(request, { params: Promise.resolve({ slug }) })
|
|
}
|
|
}
|