diff --git a/README.md b/README.md index 2921827..ea6085a 100644 --- a/README.md +++ b/README.md @@ -74,15 +74,22 @@ const { article } = await $fetch
(`/api/article/${id}`) // Auto complete working with article.id ``` +## ✔️ Adding `baseURL` -## ✔️ Support baseURL - -By setting `baseURL` option `$fetch` prepends it with respecting to trailing/leading slashes and query params for baseURL using [ufo](https://github.com/nuxt-contrib/ufo): +By using `baseURL` option, `$fetch` prepends it with respecting to trailing/leading slashes and query params for baseURL using [ufo](https://github.com/nuxt-contrib/ufo): ```js await $fetch('/config', { baseURL }) ``` +## ✔️ Adding params + +By using `params` option, `$fetch` adds params to URL by preserving params in request itself using [ufo](https://github.com/nuxt-contrib/ufo): + +```js +await $fetch('/movie?lang=en', { params: { id: 123 } }) +``` + ## 🍣 Access to Raw Response If you need to access raw response (for headers, etc), can use `$fetch.raw`: diff --git a/package.json b/package.json index 0fc13e0..5b3b64d 100644 --- a/package.json +++ b/package.json @@ -33,7 +33,7 @@ }, "devDependencies": { "@nuxt/h2": "^0.0.14", - "@nuxt/ufo": "^0.0.4", + "@nuxt/ufo": "^0.1.2", "@nuxtjs/eslint-config-typescript": "latest", "@types/flat": "latest", "@types/jest": "latest", diff --git a/src/fetch.ts b/src/fetch.ts index ec31ab6..a969b73 100644 --- a/src/fetch.ts +++ b/src/fetch.ts @@ -1,5 +1,5 @@ import destr from 'destr' -import { joinURL } from '@nuxt/ufo' +import { joinURL, withParams } from '@nuxt/ufo' import type { Fetch, RequestInfo, RequestInit, Response } from './types' import { createFetchError } from './error' @@ -7,8 +7,11 @@ export interface CreateFetchOptions { fetch: Fetch } export type FetchRequest = RequestInfo +export interface SearchParams { [key: string]: any } + export interface FetchOptions extends RequestInit { baseURL?: string + params?: SearchParams response?: boolean } @@ -21,8 +24,13 @@ export interface $Fetch { export function createFetch ({ fetch }: CreateFetchOptions): $Fetch { const raw: $Fetch['raw'] = async function (request, opts) { - if (opts && opts.baseURL && typeof request === 'string') { - request = joinURL(opts.baseURL, request) + if (opts && typeof request === 'string') { + if (opts.baseURL) { + request = joinURL(opts.baseURL, request) + } + if (opts.params) { + request = withParams(request, opts.params) + } } const response: FetchResponse = await fetch(request, opts) const text = await response.text() diff --git a/test/index.test.ts b/test/index.test.ts index a0c2493..a4b1174 100644 --- a/test/index.test.ts +++ b/test/index.test.ts @@ -1,4 +1,5 @@ import { listen, Listener } from 'listhen' +import { getParams } from '@nuxt/ufo' import { createApp } from '@nuxt/h2' import { $fetch, FetchError } from '../src/node' @@ -6,7 +7,7 @@ describe('ohmyfetch', () => { let listener: Listener it('setup', async () => { - const app = createApp().use('/api', () => ({ api: 1 })) + const app = createApp().use('/api', req => (getParams(req.url || ''))) listener = await listen(app) }) @@ -15,7 +16,10 @@ describe('ohmyfetch', () => { }) it('api', async () => { - expect(await $fetch('api', { baseURL: listener.url })).toMatchObject({ api: 1 }) + expect(await $fetch('api', { + baseURL: listener.url, + params: { api: 1 } + })).toMatchObject({ api: '1' }) }) it('404', async () => { diff --git a/yarn.lock b/yarn.lock index 064c2b7..452240c 100644 --- a/yarn.lock +++ b/yarn.lock @@ -513,10 +513,10 @@ resolved "https://registry.yarnpkg.com/@nuxt/ufo/-/ufo-0.0.3.tgz#7673a54b81c020e7aea3a9e01e09a58c494a1eca" integrity sha512-LQkuVafVNB9+ggRF7443AX1V1rEWRs32Frk7F2qnRLf8j/SzRzxEZ99jiZqxVho72zU7NcWQ6Jy62m4fkZC6Wg== -"@nuxt/ufo@^0.0.4": - version "0.0.4" - resolved "https://registry.yarnpkg.com/@nuxt/ufo/-/ufo-0.0.4.tgz#a957b55684a27e743e8d4b716072cb9a278c9790" - integrity sha512-1K8kfmQATIAirHOnwhvRJ4z53W+c6fq3mg4Z+xW5X9I9sSjjc6qjX33+SJt4I3m3o+WIuSSv2S5MCF1EVhBH/g== +"@nuxt/ufo@^0.1.2": + version "0.1.2" + resolved "https://registry.yarnpkg.com/@nuxt/ufo/-/ufo-0.1.2.tgz#2db4c7124dcffc877743e5246edf07d5dd529898" + integrity sha512-NgiCWLBPaKRNNRzzLF00xyU5h91A3Op/ZOUZY93zXvvtjgb3yMDOBkWDqOaTnv23MnRZjeRwYo1+Z3rvixsbbA== "@nuxtjs/eslint-config-typescript@latest": version "5.0.0"