我应该把Axios baseUrl conf放在sveltekit项目的什么地方?

bkkx9g8r  于 2023-03-02  发布在  iOS
关注(0)|答案(1)|浏览(133)

所有的都在标题中,更特别的是我正在使用奥瓦尔rest客户端生成器。在文档中它说你可以为axios配置baseUrl。但是我真的不知道我应该把这种配置放在svletekit项目的哪里,也许是index.js?
https://orval.dev/guides/set-base-url#:~:text=Axios.defaults.baseURL%20%3D%20%27%3CBACKEND%20URL%3E%27%3B%20//%20use%20your%20own%20URL%20here%20or%20environment%20variable

k4aesqcs

k4aesqcs1#

Axios似乎有这样的设置:

  • 如果baseUrlhttps://api.example.com
  • /endpoint/path/的请求将获得https://api.example.com/endpoint/path/

首先,不要将Axios与SvelteKit一起使用,SvelteKit有一个特殊版本的fetch(),应该使用它来代替。
SvelteKit(fetch())没有类似axios.baseURL的设置。

  • 因此,您必须使用完整路径调用外部API。
  • 内部API可通过相关请求调用。

您可以编写一个自定义 Package 器来 Package SvelteKit的fetch(),它完成与axios.baseURL相同的任务,编写一个函数,将fetch()函数作为输入,并输出一个使用基本URL的自定义获取:

const makeFetchWithBaseUrl = (fetchFunction, baseUrl) => {
    // Return a function with same the signature as fetch().
    return (resource, options) => {
        // If resource is a string that doesn't start with 'http' prepend baseUrl.
        if (typeof resource === 'string' && /^http:/.test(resource)) {
            resource = baseUrl + resource
        }
        // Call the original fetch
        return fetchFunction(resource, options)
    }
}

然后你可以像这样使用上面的函数:

// Make custom fetch function:
const exampleComFetch = makeFetchWithBaseUrl(fetch, 'https://example.com/')

// Then use it:
const response = await exampleComFetch('myEndpoint/path/')

相关问题