fix(core): when post with `headers: { 'content-type': 'application/x-…

…www-form-urlencoded' }`, shouldn't post with body
suhaotian · Mar 22, 2024 · e37c72c · e37c72c
1 parent 294535f
commit e37c72c
Show file tree

Hide file tree

Showing 8 changed files with 91 additions and 38 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,10 @@
 # CHANGELOG 📝
 
+## v0.2.6 2024/03/22
+
+- fix(core): when post with `headers: { 'content-type': 'application/x-www-form-urlencoded' }`, shouldn't post with body
+- chore(core): shorter naming words
+
 ## v0.2.5 2024/03/20
 
 - fix(plugin): fix `error-retry` plugin default options override bugs

diff --git a/Mock-plugin.md b/Mock-plugin.md
@@ -61,8 +61,8 @@ instance.get('/api/hello').then((res) => {
 Using jsDelivr CDN:
 
 ```html
-<script src="https://cdn.jsdelivr.net/npm/xior@0.2.5/dist/xior.umd.js"></script>
-<script src="https://cdn.jsdelivr.net/npm/xior@0.2.5/plugins/mock.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/xior@0.2.6/dist/xior.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/xior@0.2.6/plugins/mock.umd.js"></script>
 
 <!-- Usage -->
 <script>
@@ -79,8 +79,8 @@ Using jsDelivr CDN:
 Using unpkg CDN:
 
 ```html
-<script src="https://unpkg.com/xior@0.2.5/dist/xior.umd.js"></script>
-<script src="https://unpkg.com/xior@0.2.5/plugins/mock.umd.js"></script>
+<script src="https://unpkg.com/xior@0.2.6/dist/xior.umd.js"></script>
+<script src="https://unpkg.com/xior@0.2.6/plugins/mock.umd.js"></script>
 
 <!-- Usage -->
 <script>

diff --git a/README.md b/README.md
@@ -111,12 +111,12 @@ yarn add xior
 
 #### Use CDN
 
-> Since v0.2.1, xior support UMD format now :()
+> Since v0.2.1, xior support UMD format
 
 Use jsDelivr CDN:
 
 ```html
-<script src="https://cdn.jsdelivr.net/npm/xior@0.2.5/dist/xior.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/xior@0.2.6/dist/xior.umd.js"></script>
 
 <!-- Usage -->
 <script>
@@ -131,7 +131,7 @@ Use jsDelivr CDN:
 Use unpkg CDN:
 
 ```html
-<script src="https://unpkg.com/xior@0.2.5/dist/xior.umd.js"></script>
+<script src="https://unpkg.com/xior@0.2.6/dist/xior.umd.js"></script>
 
 <!-- Usage -->
 <script>
@@ -442,9 +442,9 @@ Use CDN:
 Using jsDelivr CDN:
 
 ```html
-<script src="https://cdn.jsdelivr.net/npm/xior@0.2.5/dist/xior.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/xior@0.2.6/dist/xior.umd.js"></script>
 <!-- Load plugin -->
-<script src="https://cdn.jsdelivr.net/npm/xior@0.2.5/plugins/error-retry.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/xior@0.2.6/plugins/error-retry.umd.js"></script>
 
 <!-- Usage -->
 <script>
@@ -457,10 +457,10 @@ Using jsDelivr CDN:
 Using unpkg CDN:
 
 ```html
-<script src="https://unpkg.com/xior@0.2.5/dist/xior.umd.js"></script>
+<script src="https://unpkg.com/xior@0.2.6/dist/xior.umd.js"></script>
 
 <!-- Load plugin -->
-<script src="https://unpkg.com/xior@0.2.5/plugins/error-retry.umd.js"></script>
+<script src="https://unpkg.com/xior@0.2.6/plugins/error-retry.umd.js"></script>
 
 <!-- Usage -->
 <script>
@@ -543,9 +543,9 @@ Use CDN:
 Using jsDelivr CDN:
 
 ```html
-<script src="https://cdn.jsdelivr.net/npm/xior@0.2.5/dist/xior.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/xior@0.2.6/dist/xior.umd.js"></script>
 <!-- Load plugin -->
-<script src="https://cdn.jsdelivr.net/npm/xior@0.2.5/plugins/throttle.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/xior@0.2.6/plugins/throttle.umd.js"></script>
 
 <!-- Usage -->
 <script>
@@ -558,10 +558,10 @@ Using jsDelivr CDN:
 Using unpkg CDN:
 
 ```html
-<script src="https://unpkg.com/xior@0.2.5/dist/xior.umd.js"></script>
+<script src="https://unpkg.com/xior@0.2.6/dist/xior.umd.js"></script>
 
 <!-- Load plugin -->
-<script src="https://unpkg.com/xior@0.2.5/plugins/throttle.umd.js"></script>
+<script src="https://unpkg.com/xior@0.2.6/plugins/throttle.umd.js"></script>
 
 <!-- Usage -->
 <script>
@@ -609,9 +609,9 @@ Use CDN:
 Using jsDelivr CDN:
 
 ```html
-<script src="https://cdn.jsdelivr.net/npm/xior@0.2.5/dist/xior.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/xior@0.2.6/dist/xior.umd.js"></script>
 <!-- Load plugin -->
-<script src="https://cdn.jsdelivr.net/npm/xior@0.2.5/plugins/dedupe.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/xior@0.2.6/plugins/dedupe.umd.js"></script>
 
 <!-- Usage -->
 <script>
@@ -624,10 +624,10 @@ Using jsDelivr CDN:
 Using unpkg CDN:
 
 ```html
-<script src="https://unpkg.com/xior@0.2.5/dist/xior.umd.js"></script>
+<script src="https://unpkg.com/xior@0.2.6/dist/xior.umd.js"></script>
 
 <!-- Load plugin -->
-<script src="https://unpkg.com/xior@0.2.5/plugins/dedupe.umd.js"></script>
+<script src="https://unpkg.com/xior@0.2.6/plugins/dedupe.umd.js"></script>
 
 <!-- Usage -->
 <script>
@@ -685,9 +685,9 @@ Use CDN:
 Using jsDelivr CDN:
 
 ```html
-<script src="https://cdn.jsdelivr.net/npm/xior@0.2.5/dist/xior.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/xior@0.2.6/dist/xior.umd.js"></script>
 <!-- Load plugin -->
-<script src="https://cdn.jsdelivr.net/npm/xior@0.2.5/plugins/error-cache.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/xior@0.2.6/plugins/error-cache.umd.js"></script>
 
 <!-- Usage -->
 <script>
@@ -700,10 +700,10 @@ Using jsDelivr CDN:
 Using unpkg CDN:
 
 ```html
-<script src="https://unpkg.com/xior@0.2.5/dist/xior.umd.js"></script>
+<script src="https://unpkg.com/xior@0.2.6/dist/xior.umd.js"></script>
 
 <!-- Load plugin -->
-<script src="https://unpkg.com/xior@0.2.5/plugins/error-cache.umd.js"></script>
+<script src="https://unpkg.com/xior@0.2.6/plugins/error-cache.umd.js"></script>
 
 <!-- Usage -->
 <script>
@@ -838,9 +838,9 @@ Use CDN:
 Using jsDelivr CDN:
 
 ```html
-<script src="https://cdn.jsdelivr.net/npm/xior@0.2.5/dist/xior.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/xior@0.2.6/dist/xior.umd.js"></script>
 <!-- Load plugin -->
-<script src="https://cdn.jsdelivr.net/npm/xior@0.2.5/plugins/progress.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/xior@0.2.6/plugins/progress.umd.js"></script>
 
 <!-- Usage -->
 <script>
@@ -853,10 +853,10 @@ Using jsDelivr CDN:
 Using unpkg CDN:
 
 ```html
-<script src="https://unpkg.com/xior@0.2.5/dist/xior.umd.js"></script>
+<script src="https://unpkg.com/xior@0.2.6/dist/xior.umd.js"></script>
 
 <!-- Load plugin -->
-<script src="https://unpkg.com/xior@0.2.5/plugins/progress.umd.js"></script>
+<script src="https://unpkg.com/xior@0.2.6/plugins/progress.umd.js"></script>
 
 <!-- Usage -->
 <script>
@@ -963,9 +963,9 @@ Use CDN:
 Using jsDelivr CDN:
 
 ```html
-<script src="https://cdn.jsdelivr.net/npm/xior@0.2.5/dist/xior.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/xior@0.2.6/dist/xior.umd.js"></script>
 <!-- Load plugin -->
-<script src="https://cdn.jsdelivr.net/npm/xior@0.2.5/plugins/mock.umd.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/xior@0.2.6/plugins/mock.umd.js"></script>
 
 <!-- Usage -->
 <script>
@@ -978,10 +978,10 @@ Using jsDelivr CDN:
 Using unpkg CDN:
 
 ```html
-<script src="https://unpkg.com/xior@0.2.5/dist/xior.umd.js"></script>
+<script src="https://unpkg.com/xior@0.2.6/dist/xior.umd.js"></script>
 
 <!-- Load plugin -->
-<script src="https://unpkg.com/xior@0.2.5/plugins/mock.umd.js"></script>
+<script src="https://unpkg.com/xior@0.2.6/plugins/mock.umd.js"></script>
 
 <!-- Usage -->
 <script>

diff --git a/next-example/app/api/client/page.tsx b/next-example/app/api/client/page.tsx
@@ -0,0 +1,20 @@
+'use client';
+
+import { useEffect } from 'react';
+
+import { http } from '@/app/http';
+
+export default function ClientPage() {
+  useEffect(() => {
+    http.post(
+      '/',
+      { data: 123456 },
+      {
+        headers: {
+          'content-type': 'application/x-www-form-urlencoded',
+        },
+      }
+    );
+  }, []);
+  return <div>hello</div>;
+}
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "xior",
-  "version": "0.2.5",
+  "version": "0.2.6",
   "description": "A lite request lib based on fetch with plugins support, and axios similar API",
   "repository": "suhaotian/xior",
   "bugs": "https://github.com/suhaotian/xior/issues",

diff --git a/src/interceptors.ts b/src/interceptors.ts
@@ -1,7 +1,7 @@
 import type { XiorInterceptorRequestConfig } from './types';
 import { encodeParams, merge } from './utils';
 
-const encodeUrlType = 'application/x-www-form-urlencoded';
+export const formUrl = 'application/x-www-form-urlencoded';
 const jsonType = 'application/json';
 // const formType = 'multipart/form-data';
 
@@ -31,14 +31,16 @@ export default async function defaultRequestInterceptor(
       });
       if (contentTypeKey) {
         contentType = req.headers[contentTypeKey];
+        req.headers['Content-Type'] = contentType;
+        delete req.headers[contentTypeKey];
       }
     }
     if (!contentType) {
-      contentType = likeGET(method) ? encodeUrlType : jsonType;
+      contentType = likeGET(method) ? formUrl : jsonType;
       headers['Content-Type'] = contentType;
     }
 
-    if (contentType === encodeUrlType && (typeof data === 'object' || req.params)) {
+    if (contentType === formUrl && (typeof data === 'object' || req.params)) {
       encodedParams = true;
       const encodeUrlData = encode(merge(data || {}, req.params || {}), encodeURI);
       if (encodeUrlData) {

diff --git a/src/xior.ts b/src/xior.ts
@@ -1,4 +1,4 @@
-import defaultRequestInterceptor, { likeGET } from './interceptors';
+import defaultRequestInterceptor, { formUrl, likeGET } from './interceptors';
 import type {
   XiorInterceptorRequestConfig,
   XiorPlugin,
@@ -23,7 +23,7 @@ export class xior {
   static create(options?: XiorRequestConfig): XiorInstance {
     return new xior(options);
   }
-  static VERSION = '0.2.5';
+  static VERSION = '0.2.6';
 
   config?: XiorRequestConfig;
   defaults: XiorInterceptorRequestConfig;
@@ -201,7 +201,10 @@ export class xior {
     }
 
     const response = await fetch(finalURL, {
-      body: likeGET(requestConfig.method) ? undefined : _data,
+      body:
+        likeGET(requestConfig.method) || requestConfig.headers?.['Content-Type'] === formUrl
+          ? undefined
+          : _data,
       ...rest,
       signal,
       method,

diff --git a/tests/src/tests/index.test.ts b/tests/src/tests/index.test.ts
@@ -54,6 +54,29 @@ describe('xior tests', () => {
       assert.strictEqual(data.query.b, '2');
     });
 
+    it("POST should work without body when header's `content-type: application/x-www-form-urlencoded`", async () => {
+      const { data } = await xiorInstance.post<{
+        method: string;
+        body: Record<string, any>;
+        query: Record<string, any>;
+      }>(
+        '/post',
+        { a: 1, b: 2 },
+        {
+          params: { c: 3, d: 4 },
+          headers: {
+            'content-type': 'application/x-www-form-urlencoded',
+          },
+        }
+      );
+      assert.strictEqual(data.method, 'post');
+      assert.strictEqual(Object.keys(data.query).length, 4);
+      assert.strictEqual(data.query.a, '1');
+      assert.strictEqual(data.query.b, '2');
+      assert.strictEqual(data.query.c, '3');
+      assert.strictEqual(data.query.d, '4');
+    });
+
     it('DELETE should work', async () => {
       const { data } = await xiorInstance.delete<{
         method: string;