feat: allow passing body as argument

master
pooya parsa 2019-04-10 01:03:35 +04:30
parent 62d4b3fda4
commit 57b8a8be9a
4 changed files with 71 additions and 82 deletions

View File

@ -31,23 +31,3 @@ Supported response types:
- `formData` - `formData`
- `arrayBuffer` - `arrayBuffer`
- `blob` - `blob`
## Sending requests with body
Despire axios, fetch and ky always accept **two** arguments for making requests (input and options). You have to pass request body in options:
For plain data or `Body`:
```diff
-- this.$axios.post('/url', 'some data')
++ this.$http.post('/url', { body: 'some data' })
```
For JSON:
```diff
-- this.$axios.post('/url', { name: 'foo' })
++ this.$http.post('/url', { json: { name: 'foo' } })
```
* `json` is a shortcut to `body` that sets `content-type` header and serializes JSON object.

View File

@ -4,14 +4,16 @@
Available HTTP methods: Available HTTP methods:
- `get` - `get(url, options?)`
- `post` - `head(url, options?)`
- `put` - `delete(url, options?)`
- `patch` - `post(url, body?, options?)`
- `head` - `put(url, body?, options?)`
- `delete` - `patch(url, body?, options?)`
For making a request use `$http.<method>(<url>, <options>)`. Returns a Promise that either rejects in case of network errors or resolves to a [Reponse](https://developer.mozilla.org/en-US/docs/Web/API/Response) object. You can use methods to convert response stream into usable data: Calling these methods, returns a Promise that resolves to a [Reponse](https://developer.mozilla.org/en-US/docs/Web/API/Response) object or rejects in case of network errors.
You can use methods to convert response stream into usable data:
- `json` - `json`
- `text` - `text`
@ -19,7 +21,7 @@ For making a request use `$http.<method>(<url>, <options>)`. Returns a Promise t
- `arrayBuffer` - `arrayBuffer`
- `blob` - `blob`
**Example: Fetch a json file** **Example: Get a json file**
```js ```js
await $http.get('https://unpkg.com/nuxt/package.json').json() await $http.get('https://unpkg.com/nuxt/package.json').json()
@ -31,7 +33,7 @@ Alternatively for json only you can use `$` prefixed shortcut:
await $http.$get('https://unpkg.com/nuxt/package.json') await $http.$get('https://unpkg.com/nuxt/package.json')
``` ```
See [ky](https://github.com/sindresorhus/ky) docs for all available options. See [ky](https://github.com/sindresorhus/ky#options) docs for all available options.
### Sending Body ### Sending Body

View File

@ -44,16 +44,33 @@ class HTTP {
} }
} }
for (let method of ['get', 'post', 'put', 'patch', 'head', 'delete']) { for (let method of ['get', 'head', 'delete', 'post', 'put', 'patch']) {
HTTP.prototype[method] = async function (input, options) { const hasBody = ['post', 'put', 'patch'].includes(method)
HTTP.prototype[method] = async function (url, arg1, arg2) {
let options
if (!hasBody) {
options = arg1
} else {
options = arg2 || {}
if (arg1 !== undefined) {
if (arg1.constructor === Object) {
options.json = arg1
} else {
options.body = arg1
}
}
}
const _options = { ...this._defaults, ...options } const _options = { ...this._defaults, ...options }
if (/^https?/.test(input)) { if (/^https?/.test(url)) {
delete _options.prefixUrl delete _options.prefixUrl
} }
try { try {
const response = await this._ky[method](input, _options) const response = await this._ky[method](url, _options)
return response return response
} catch (error) { } catch (error) {
// Call onError hook // Call onError hook
@ -65,8 +82,8 @@ for (let method of ['get', 'post', 'put', 'patch', 'head', 'delete']) {
} }
} }
HTTP.prototype['$' + method] = function (input, options) { HTTP.prototype['$' + method] = function (url, arg1, arg2) {
return this[method](input, options).then(res => res.json()) return this[method](url, arg1, arg2).then(res => res.json())
} }
} }

84
types/index.d.ts vendored
View File

@ -4,114 +4,104 @@ import './vuex'
type Omit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>; type Omit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>;
type JSONObject = { [key: string]: JSONValue }; type RequestBody = string | number | boolean | null | object | BodyInit
interface JSONArray extends Array<JSONValue> { }
type JSONValue = string | number | boolean | null | JSONObject | JSONArray;
interface OptionsWithoutBody extends Omit<Options, 'body'> {
method?: 'get' | 'head'
}
interface OptionsWithBody extends Options {
method?: 'post' | 'put' | 'delete'
}
interface NuxtHTTPInstance { interface NuxtHTTPInstance {
/** /**
* Fetches the `input` URL with the option `{method: 'get'}`. * Fetches the `url` with the option `{method: 'get'}`.
* *
* @param input - `Request` object, `URL` object, or URL string. * @param url - `Request` object, `URL` object, or URL string.
* @returns Promise with `Body` method added. * @returns Promise with `Body` method added.
*/ */
get(input: Request | URL | string, options?: Omit<Options, 'body'>): ResponsePromise; get(url: Request | URL | string, options?: Omit<Options, 'body'>): ResponsePromise;
/** /**
* Fetches the `input` URL with the option `{method: 'post'}`. * Fetches the `url` with the option `{method: 'post'}`.
* *
* @param input - `Request` object, `URL` object, or URL string. * @param url - `Request` object, `URL` object, or URL string.
* @returns Promise with `Body` method added. * @returns Promise with `Body` method added.
*/ */
post(input: Request | URL | string, options?: Options): ResponsePromise; post(url: Request | URL | string, body?: RequestBody, options?: Options): ResponsePromise;
/** /**
* Fetches the `input` URL with the option `{method: 'put'}`. * Fetches the `url` with the option `{method: 'put'}`.
* *
* @param input - `Request` object, `URL` object, or URL string. * @param url - `Request` object, `URL` object, or URL string.
* @returns Promise with `Body` method added. * @returns Promise with `Body` method added.
*/ */
put(input: Request | URL | string, options?: Options): ResponsePromise; put(url: Request | URL | string, body?: RequestBody, options?: Options): ResponsePromise;
/** /**
* Fetches the `input` URL with the option `{method: 'patch'}`. * Fetches the `url` with the option `{method: 'patch'}`.
* *
* @param input - `Request` object, `URL` object, or URL string. * @param url - `Request` object, `URL` object, or URL string.
* @returns Promise with `Body` method added. * @returns Promise with `Body` method added.
*/ */
patch(input: Request | URL | string, options?: Options): ResponsePromise; patch(url: Request | URL | string, body?: RequestBody, options?: Options): ResponsePromise;
/** /**
* Fetches the `input` URL with the option `{method: 'head'}`. * Fetches the `url` with the option `{method: 'head'}`.
* *
* @param input - `Request` object, `URL` object, or URL string. * @param url - `Request` object, `URL` object, or URL string.
* @returns Promise with `Body` method added. * @returns Promise with `Body` method added.
*/ */
head(input: Request | URL | string, options?: Omit<Options, 'body'>): ResponsePromise; head(url: Request | URL | string, options?: Omit<Options, 'body'>): ResponsePromise;
/** /**
* Fetches the `input` URL with the option `{method: 'delete'}`. * Fetches the `url` with the option `{method: 'delete'}`.
* *
* @param input - `Request` object, `URL` object, or URL string. * @param url - `Request` object, `URL` object, or URL string.
* @returns Promise with `Body` method added. * @returns Promise with `Body` method added.
*/ */
delete(input: Request | URL | string, options?: Options): ResponsePromise; delete(url: Request | URL | string, options?: Options): ResponsePromise;
/** /**
* Fetches the `input` URL with the option `{method: 'get'}`. * Fetches the `url` with the option `{method: 'get'}`.
* *
* @param input - `Request` object, `URL` object, or URL string. * @param url - `Request` object, `URL` object, or URL string.
* @returns Promise that resolves to JSON parsed value. * @returns Promise that resolves to JSON parsed value.
*/ */
$get<T= JSONValue>(input: Request | URL | string, options?: Omit<Options, 'body'>): Promise<T>; $get<T = JSONValue>(url: Request | URL | string, options?: Omit<Options, 'body'>): Promise<T>;
/** /**
* Fetches the `input` URL with the option `{method: 'post'}`. * Fetches the `url` with the option `{method: 'post'}`.
* *
* @param input - `Request` object, `URL` object, or URL string. * @param url - `Request` object, `URL` object, or URL string.
* @returns Promise that resolves to JSON parsed value. * @returns Promise that resolves to JSON parsed value.
*/ */
$post<T = JSONValue>(input: Request | URL | string, options?: Options): Promise<T>; $post<T = JSONValue>(url: Request | URL | string, body?: RequestBody, options?: Options): Promise<T>;
/** /**
* Fetches the `input` URL with the option `{method: 'put'}`. * Fetches the `url` with the option `{method: 'put'}`.
* *
* @param input - `Request` object, `URL` object, or URL string. * @param url - `Request` object, `URL` object, or URL string.
* @returns Promise that resolves to JSON parsed value. * @returns Promise that resolves to JSON parsed value.
*/ */
$put<T = JSONValue>(input: Request | URL | string, options?: Options): Promise<T>; $put<T = JSONValue>(url: Request | URL | string, body?: RequestBody, options?: Options): Promise<T>;
/** /**
* Fetches the `input` URL with the option `{method: 'patch'}`. * Fetches the `url` with the option `{method: 'patch'}`.
* *
* @param input - `Request` object, `URL` object, or URL string. * @param url - `Request` object, `URL` object, or URL string.
* @returns Promise that resolves to JSON parsed value. * @returns Promise that resolves to JSON parsed value.
*/ */
$patch<T = JSONValue>(input: Request | URL | string, options?: Options): Promise<T>; $patch<T = JSONValue>(url: Request | URL | string, body?: RequestBody, options?: Options): Promise<T>;
/** /**
* Fetches the `input` URL with the option `{method: 'head'}`. * Fetches the `url` with the option `{method: 'head'}`.
* *
* @param input - `Request` object, `URL` object, or URL string. * @param url - `Request` object, `URL` object, or URL string.
* @returns Promise that resolves to JSON parsed value. * @returns Promise that resolves to JSON parsed value.
*/ */
$head<T = JSONValue>(input: Request | URL | string, options?: Omit<Options, 'body'>): Promise<T>; $head<T = JSONValue>(url: Request | URL | string, options?: Omit<Options, 'body'>): Promise<T>;
/** /**
* Fetches the `input` URL with the option `{method: 'delete'}`. * Fetches the `url` with the option `{method: 'delete'}`.
* *
* @param input - `Request` object, `URL` object, or URL string. * @param url - `Request` object, `URL` object, or URL string.
* @returns Promise that resolves to JSON parsed value. * @returns Promise that resolves to JSON parsed value.
*/ */
$delete<T = JSONValue>(input: Request | URL | string, options?: Options): Promise<T>; $delete<T = JSONValue>(url: Request | URL | string, options?: Options): Promise<T>;
/** /**