fix: handle application/x-www-form-urlencoded content in request body

hey-api · Jul 17, 2024 · f6be838 · f6be838
1 parent 9ba3266
commit f6be838
Show file tree

Hide file tree

Showing 49 changed files with 584 additions and 159 deletions.
diff --git a/.changeset/smooth-dingos-unite.md b/.changeset/smooth-dingos-unite.md
@@ -0,0 +1,6 @@
+---
+'@hey-api/client-fetch': patch
+'@hey-api/openapi-ts': patch
+---
+
+fix: handle application/x-www-form-urlencoded content in request body
diff --git a/packages/client-core/src/types.ts b/packages/client-core/src/types.ts
@@ -10,7 +10,7 @@ export type ApiRequestOptions<T = unknown> = {
   readonly body?: any;
   readonly cookies?: Record<string, unknown>;
   readonly errors?: Record<number | string, string>;
-  readonly formData?: Record<string, unknown>;
+  readonly formData?: Record<string, unknown> | Record<string, unknown>[];
   readonly headers?: Record<string, unknown>;
   readonly mediaType?: string;
   readonly method:

diff --git a/packages/client-fetch/src/index.ts b/packages/client-fetch/src/index.ts
@@ -69,10 +69,6 @@ export const createClient = (config: Config): Client => {
       redirect: 'follow',
       ...opts,
     };
-    // remove Content-Type if serialized body is FormData; browser will correctly set Content-Type and boundary expression
-    if (requestInit.body instanceof FormData) {
-      requestInit.headers.delete('Content-Type');
-    }
 
     let request = new Request(url, requestInit);
 

diff --git a/packages/client-fetch/src/node/index.ts b/packages/client-fetch/src/node/index.ts
@@ -1,3 +1,7 @@
 export { client, createClient } from '../';
 export type { Client, Options, RequestResult } from '../types';
-export { formDataBodySerializer, jsonBodySerializer } from '../utils';
+export {
+  formDataBodySerializer,
+  jsonBodySerializer,
+  urlSearchParamsBodySerializer,
+} from '../utils';
diff --git a/packages/client-fetch/src/utils.ts b/packages/client-fetch/src/utils.ts
@@ -460,43 +460,72 @@ export const createInterceptors = <Req, Res, Options>() => ({
   response: new Interceptors<ResInterceptor<Res, Req, Options>>(),
 });
 
-const serializeFormDataPair = (
-  formData: FormData,
-  key: string,
-  value: unknown,
-) => {
+const serializeFormDataPair = (data: FormData, key: string, value: unknown) => {
   if (typeof value === 'string' || value instanceof Blob) {
-    formData.append(key, value);
+    data.append(key, value);
   } else {
-    formData.append(key, JSON.stringify(value));
+    data.append(key, JSON.stringify(value));
   }
 };
 
 export const formDataBodySerializer = {
   bodySerializer: <T extends Record<string, any> | Array<Record<string, any>>>(
     body: T,
   ) => {
-    const formData = new FormData();
+    const data = new FormData();
 
     Object.entries(body).forEach(([key, value]) => {
       if (value === undefined || value === null) {
         return;
       }
       if (Array.isArray(value)) {
-        value.forEach((v) => serializeFormDataPair(formData, key, v));
+        value.forEach((v) => serializeFormDataPair(data, key, v));
       } else {
-        serializeFormDataPair(formData, key, value);
+        serializeFormDataPair(data, key, value);
       }
     });
 
-    return formData;
+    return data;
   },
 };
 
 export const jsonBodySerializer = {
   bodySerializer: <T>(body: T) => JSON.stringify(body),
 };
 
+const serializeUrlSearchParamsPair = (
+  data: URLSearchParams,
+  key: string,
+  value: unknown,
+) => {
+  if (typeof value === 'string') {
+    data.append(key, value);
+  } else {
+    data.append(key, JSON.stringify(value));
+  }
+};
+
+export const urlSearchParamsBodySerializer = {
+  bodySerializer: <T extends Record<string, any> | Array<Record<string, any>>>(
+    body: T,
+  ) => {
+    const data = new URLSearchParams();
+
+    Object.entries(body).forEach(([key, value]) => {
+      if (value === undefined || value === null) {
+        return;
+      }
+      if (Array.isArray(value)) {
+        value.forEach((v) => serializeUrlSearchParamsPair(data, key, v));
+      } else {
+        serializeUrlSearchParamsPair(data, key, value);
+      }
+    });
+
+    return data;
+  },
+};
+
 const defaultQuerySerializer = createQuerySerializer({
   allowReserved: false,
   array: {

diff --git a/packages/openapi-ts/src/generate/services.ts b/packages/openapi-ts/src/generate/services.ts
@@ -247,14 +247,33 @@ const toRequestOptions = (
       .map((parameter) => parameter.mediaType)
       .filter(Boolean)
       .filter(unique);
-    if (contents.length === 1 && contents[0] === 'multipart/form-data') {
-      obj = [
-        ...obj,
-        {
-          spread: 'formDataBodySerializer',
-        },
-      ];
-      onClientImport?.('formDataBodySerializer');
+    if (contents.length === 1) {
+      if (contents[0] === 'multipart/form-data') {
+        obj = [
+          ...obj,
+          {
+            spread: 'formDataBodySerializer',
+          },
+          // no need for Content-Type header, browser will set it automatically
+        ];
+        onClientImport?.('formDataBodySerializer');
+      }
+
+      if (contents[0] === 'application/x-www-form-urlencoded') {
+        obj = [
+          ...obj,
+          {
+            spread: 'urlSearchParamsBodySerializer',
+          },
+          {
+            key: 'headers',
+            value: {
+              'Content-Type': contents[0],
+            },
+          },
+        ];
+        onClientImport?.('urlSearchParamsBodySerializer');
+      }
     }
 
     // TODO: set parseAs to skip inference if every result has the same

diff --git a/packages/openapi-ts/src/templates/core/ApiRequestOptions.hbs b/packages/openapi-ts/src/templates/core/ApiRequestOptions.hbs
@@ -1,14 +1,21 @@
 export type ApiRequestOptions<T = unknown> = {
-	readonly method: 'GET' | 'PUT' | 'POST' | 'DELETE' | 'OPTIONS' | 'HEAD' | 'PATCH';
-	readonly url: string;
-	readonly path?: Record<string, unknown>;
+	readonly body?: any;
 	readonly cookies?: Record<string, unknown>;
+	readonly errors?: Record<number | string, string>;
+	readonly formData?: Record<string, unknown> | Record<string, unknown>[];
 	readonly headers?: Record<string, unknown>;
-	readonly query?: Record<string, unknown>;
-	readonly formData?: Record<string, unknown>;
-	readonly body?: any;
 	readonly mediaType?: string;
+	readonly method:
+		| 'DELETE'
+		| 'GET'
+		| 'HEAD'
+		| 'OPTIONS'
+		| 'PATCH'
+		| 'POST'
+		| 'PUT';
+	readonly path?: Record<string, unknown>;
+	readonly query?: Record<string, unknown>;
 	readonly responseHeader?: string;
 	readonly responseTransformer?: (data: unknown) => Promise<T>;
-	readonly errors?: Record<number | string, string>;
+	readonly url: string;
 };
diff --git a/packages/openapi-ts/test/__snapshots__/test/generated/v2/core/ApiRequestOptions.ts.snap b/packages/openapi-ts/test/__snapshots__/test/generated/v2/core/ApiRequestOptions.ts.snap
@@ -1,14 +1,21 @@
 export type ApiRequestOptions<T = unknown> = {
-	readonly method: 'GET' | 'PUT' | 'POST' | 'DELETE' | 'OPTIONS' | 'HEAD' | 'PATCH';
-	readonly url: string;
-	readonly path?: Record<string, unknown>;
+	readonly body?: any;
 	readonly cookies?: Record<string, unknown>;
+	readonly errors?: Record<number | string, string>;
+	readonly formData?: Record<string, unknown> | Record<string, unknown>[];
 	readonly headers?: Record<string, unknown>;
-	readonly query?: Record<string, unknown>;
-	readonly formData?: Record<string, unknown>;
-	readonly body?: any;
 	readonly mediaType?: string;
+	readonly method:
+		| 'DELETE'
+		| 'GET'
+		| 'HEAD'
+		| 'OPTIONS'
+		| 'PATCH'
+		| 'POST'
+		| 'PUT';
+	readonly path?: Record<string, unknown>;
+	readonly query?: Record<string, unknown>;
 	readonly responseHeader?: string;
 	readonly responseTransformer?: (data: unknown) => Promise<T>;
-	readonly errors?: Record<number | string, string>;
+	readonly url: string;
 };
diff --git a/packages/openapi-ts/test/__snapshots__/test/generated/v3/core/ApiRequestOptions.ts.snap b/packages/openapi-ts/test/__snapshots__/test/generated/v3/core/ApiRequestOptions.ts.snap
@@ -1,14 +1,21 @@
 export type ApiRequestOptions<T = unknown> = {
-	readonly method: 'GET' | 'PUT' | 'POST' | 'DELETE' | 'OPTIONS' | 'HEAD' | 'PATCH';
-	readonly url: string;
-	readonly path?: Record<string, unknown>;
+	readonly body?: any;
 	readonly cookies?: Record<string, unknown>;
+	readonly errors?: Record<number | string, string>;
+	readonly formData?: Record<string, unknown> | Record<string, unknown>[];
 	readonly headers?: Record<string, unknown>;
-	readonly query?: Record<string, unknown>;
-	readonly formData?: Record<string, unknown>;
-	readonly body?: any;
 	readonly mediaType?: string;
+	readonly method:
+		| 'DELETE'
+		| 'GET'
+		| 'HEAD'
+		| 'OPTIONS'
+		| 'PATCH'
+		| 'POST'
+		| 'PUT';
+	readonly path?: Record<string, unknown>;
+	readonly query?: Record<string, unknown>;
 	readonly responseHeader?: string;
 	readonly responseTransformer?: (data: unknown) => Promise<T>;
-	readonly errors?: Record<number | string, string>;
+	readonly url: string;
 };
diff --git a/packages/openapi-ts/test/__snapshots__/test/generated/v3/services.gen.ts.snap b/packages/openapi-ts/test/__snapshots__/test/generated/v3/services.gen.ts.snap
@@ -3,7 +3,7 @@
 import type { CancelablePromise } from './core/CancelablePromise';
 import { OpenAPI } from './core/OpenAPI';
 import { request as __request } from './core/request';
-import type { ImportData, ImportResponse, ApiVversionOdataControllerCountResponse, DeleteFooData3, CallWithParametersData, CallWithWeirdParameterNamesData, GetCallWithOptionalParamData, PostCallWithOptionalParamData, CallWithDescriptionsData, DeprecatedCallData, PostApiRequestBodyData, PostApiFormDataData, CallWithDefaultParametersData, CallWithDefaultOptionalParametersData, CallToTestOrderOfParamsData, CallWithNoContentResponseResponse, CallWithResponseAndNoContentResponseResponse, CallWithResponseResponse, CallWithDuplicateResponsesResponse, CallWithResponsesResponse, DummyAResponse, DummyBResponse, CollectionFormatData, TypesData, TypesResponse, UploadFileData, UploadFileResponse, FileResponseData, FileResponseResponse, ComplexTypesData, ComplexTypesResponse, ComplexParamsData, ComplexParamsResponse, MultipartRequestData, MultipartResponseResponse, CallWithResultFromHeaderResponse, TestErrorCodeData, TestErrorCodeResponse, NonAsciiæøåÆøÅöôêÊ字符串Data, NonAsciiæøåÆøÅöôêÊ字符串Response } from './types.gen';
+import type { ImportData, ImportResponse, ApiVversionOdataControllerCountResponse, DeleteFooData3, CallWithParametersData, CallWithWeirdParameterNamesData, GetCallWithOptionalParamData, PostCallWithOptionalParamData, CallWithDescriptionsData, DeprecatedCallData, PostApiRequestBodyData, PostApiFormDataData, CallWithDefaultParametersData, CallWithDefaultOptionalParametersData, CallToTestOrderOfParamsData, CallWithNoContentResponseResponse, CallWithResponseAndNoContentResponseResponse, CallWithResponseResponse, CallWithDuplicateResponsesResponse, CallWithResponsesResponse, DummyAResponse, DummyBResponse, CollectionFormatData, TypesData, TypesResponse, UploadFileData, UploadFileResponse, FileResponseData, FileResponseResponse, ComplexTypesData, ComplexTypesResponse, ComplexParamsData, ComplexParamsResponse, MultipartRequestData, MultipartResponseResponse, CallWithResultFromHeaderResponse, TestErrorCodeData, TestErrorCodeResponse, NonAsciiæøåÆøÅöôêÊ字符串Data, NonAsciiæøåÆøÅöôêÊ字符串Response, PutWithFormUrlEncodedData } from './types.gen';
 
 export class DefaultService {
     /**
@@ -859,4 +859,19 @@ export class NonAsciiÆøåÆøÅöôêÊService {
         });
     }
 
+    /**
+     * Login User
+     * @param data The data for the request.
+     * @param data.formData
+     * @throws ApiError
+     */
+    public static putWithFormUrlEncoded(data: PutWithFormUrlEncodedData): CancelablePromise<void> {
+        return __request(OpenAPI, {
+            method: 'PUT',
+            url: '/api/v{api-version}/non-ascii-æøåÆØÅöôêÊ字符串',
+            formData: data.formData,
+            mediaType: 'application/x-www-form-urlencoded'
+        });
+    }
+
 }
diff --git a/packages/openapi-ts/test/__snapshots__/test/generated/v3/types.gen.ts.snap b/packages/openapi-ts/test/__snapshots__/test/generated/v3/types.gen.ts.snap
@@ -1428,6 +1428,10 @@ export type NonAsciiæøåÆøÅöôêÊ字符串Data = {
 
 export type NonAsciiæøåÆøÅöôêÊ字符串Response = Array<NonAsciiStringæøåÆØÅöôêÊ字符串>;
 
+export type PutWithFormUrlEncodedData = {
+    formData: ArrayWithStrings;
+};
+
 export type $OpenApiTs = {
     '/api/v{api-version}/no-tag': {
         post: {
@@ -1784,5 +1788,8 @@ export type $OpenApiTs = {
                 200: Array<NonAsciiStringæøåÆØÅöôêÊ字符串>;
             };
         };
+        put: {
+            req: PutWithFormUrlEncodedData;
+        };
     };
 };
diff --git a/...es/openapi-ts/test/__snapshots__/test/generated/v3_angular/core/ApiRequestOptions.ts.snap b/...es/openapi-ts/test/__snapshots__/test/generated/v3_angular/core/ApiRequestOptions.ts.snap
@@ -1,14 +1,21 @@
 export type ApiRequestOptions<T = unknown> = {
-	readonly method: 'GET' | 'PUT' | 'POST' | 'DELETE' | 'OPTIONS' | 'HEAD' | 'PATCH';
-	readonly url: string;
-	readonly path?: Record<string, unknown>;
+	readonly body?: any;
 	readonly cookies?: Record<string, unknown>;
+	readonly errors?: Record<number | string, string>;
+	readonly formData?: Record<string, unknown> | Record<string, unknown>[];
 	readonly headers?: Record<string, unknown>;
-	readonly query?: Record<string, unknown>;
-	readonly formData?: Record<string, unknown>;
-	readonly body?: any;
 	readonly mediaType?: string;
+	readonly method:
+		| 'DELETE'
+		| 'GET'
+		| 'HEAD'
+		| 'OPTIONS'
+		| 'PATCH'
+		| 'POST'
+		| 'PUT';
+	readonly path?: Record<string, unknown>;
+	readonly query?: Record<string, unknown>;
 	readonly responseHeader?: string;
 	readonly responseTransformer?: (data: unknown) => Promise<T>;
-	readonly errors?: Record<number | string, string>;
+	readonly url: string;
 };
diff --git a/packages/openapi-ts/test/__snapshots__/test/generated/v3_angular/services.gen.ts.snap b/packages/openapi-ts/test/__snapshots__/test/generated/v3_angular/services.gen.ts.snap
@@ -5,7 +5,7 @@ import { HttpClient } from '@angular/common/http';
 import type { Observable } from 'rxjs';
 import { OpenAPI } from './core/OpenAPI';
 import { request as __request } from './core/request';
-import type { ImportData, ImportResponse, ApiVversionOdataControllerCountResponse, DeleteFooData3, CallWithParametersData, CallWithWeirdParameterNamesData, GetCallWithOptionalParamData, PostCallWithOptionalParamData, CallWithDescriptionsData, DeprecatedCallData, PostApiRequestBodyData, PostApiFormDataData, CallWithDefaultParametersData, CallWithDefaultOptionalParametersData, CallToTestOrderOfParamsData, CallWithNoContentResponseResponse, CallWithResponseAndNoContentResponseResponse, CallWithResponseResponse, CallWithDuplicateResponsesResponse, CallWithResponsesResponse, DummyAResponse, DummyBResponse, CollectionFormatData, TypesData, TypesResponse, UploadFileData, UploadFileResponse, FileResponseData, FileResponseResponse, ComplexTypesData, ComplexTypesResponse, ComplexParamsData, ComplexParamsResponse, MultipartRequestData, MultipartResponseResponse, CallWithResultFromHeaderResponse, TestErrorCodeData, TestErrorCodeResponse, NonAsciiæøåÆøÅöôêÊ字符串Data, NonAsciiæøåÆøÅöôêÊ字符串Response } from './types.gen';
+import type { ImportData, ImportResponse, ApiVversionOdataControllerCountResponse, DeleteFooData3, CallWithParametersData, CallWithWeirdParameterNamesData, GetCallWithOptionalParamData, PostCallWithOptionalParamData, CallWithDescriptionsData, DeprecatedCallData, PostApiRequestBodyData, PostApiFormDataData, CallWithDefaultParametersData, CallWithDefaultOptionalParametersData, CallToTestOrderOfParamsData, CallWithNoContentResponseResponse, CallWithResponseAndNoContentResponseResponse, CallWithResponseResponse, CallWithDuplicateResponsesResponse, CallWithResponsesResponse, DummyAResponse, DummyBResponse, CollectionFormatData, TypesData, TypesResponse, UploadFileData, UploadFileResponse, FileResponseData, FileResponseResponse, ComplexTypesData, ComplexTypesResponse, ComplexParamsData, ComplexParamsResponse, MultipartRequestData, MultipartResponseResponse, CallWithResultFromHeaderResponse, TestErrorCodeData, TestErrorCodeResponse, NonAsciiæøåÆøÅöôêÊ字符串Data, NonAsciiæøåÆøÅöôêÊ字符串Response, PutWithFormUrlEncodedData } from './types.gen';
 
 @Injectable({
     providedIn: 'root'
@@ -976,4 +976,19 @@ export class NonAsciiÆøåÆøÅöôêÊService {
         });
     }
 
+    /**
+     * Login User
+     * @param data The data for the request.
+     * @param data.formData
+     * @throws ApiError
+     */
+    public putWithFormUrlEncoded(data: PutWithFormUrlEncodedData): Observable<void> {
+        return __request(OpenAPI, this.http, {
+            method: 'PUT',
+            url: '/api/v{api-version}/non-ascii-æøåÆØÅöôêÊ字符串',
+            formData: data.formData,
+            mediaType: 'application/x-www-form-urlencoded'
+        });
+    }
+
 }
diff --git a/packages/openapi-ts/test/__snapshots__/test/generated/v3_angular/types.gen.ts.snap b/packages/openapi-ts/test/__snapshots__/test/generated/v3_angular/types.gen.ts.snap
@@ -1305,6 +1305,10 @@ export type NonAsciiæøåÆøÅöôêÊ字符串Data = {
 
 export type NonAsciiæøåÆøÅöôêÊ字符串Response = Array<NonAsciiStringæøåÆØÅöôêÊ字符串>;
 
+export type PutWithFormUrlEncodedData = {
+    formData: ArrayWithStrings;
+};
+
 export type $OpenApiTs = {
     '/api/v{api-version}/no-tag': {
         post: {
@@ -1661,5 +1665,8 @@ export type $OpenApiTs = {
                 200: Array<NonAsciiStringæøåÆØÅöôêÊ字符串>;
             };
         };
+        put: {
+            req: PutWithFormUrlEncodedData;
+        };
     };
 };