use-http
use-http copied to clipboard
[1.0.9] Relative requests become absolute
Describe the bug Relative paths become absolute
⚠️ Make a Codesandbox ⚠️ Couldn't think of how to make a relative path codesandbox
To Reproduce Steps to reproduce the behavior:
- Create a page in a folder http://example.com/foo/mypage.html
- useFetch('nested/myapi')
- Notice unexpected path queried http://example.com/nested/myapi
Expected behavior Expected path queried http://example.com/foo/nested/myapi
Ah, interesting. Okay. Will fix. As a workaround for now, set a global url in the Provider.
Just looking back at this. How is your app configured? If your your website is at https://example.com/foo, that means if you don't specify a global url then your host is going to be https://example.com. For example:
// in browser at https://example.com/app
useFetch('/todos') // will fetch the same as native `fetch` at https://example.com/todos
// not at: https://example.com/app/todos
If you want the api to be at https://example.com/app/todos
you would need to set your global url in the Provider
to be <Provider url='https://example.com/app' />
When in browser at https://example.com/app
fetch('todos')
queries https://example.com/app/todos
so it is surprising when useFetch('todos')
queries https://example.com/todos
I would claim you should only call addSlash if the thing before it isn't empty string. That way when you don't use provider it behaves like fetch
. Since provider also sets more than just the base url I would recommend the provider defaulting to empty string, so if you set something other than the base url it still behaves like fetch.
I am totally open to this, however I'm not able to reproduce the same native fetch functionality you're describing. Hmm... maybe I'm missing something?
here I'm at route
/roster
and I call fetch to /test
in the console. Now when we look at the network tab, you can see the request was made to /test
and not /roster/test
.
But again, maybe I'm missing something.
fetch("test")
no slash
Still seems the same. Can you take a screenshot and show me?


I'm happy to add this. Do you want to submit a PR?
To be honest, I've removed use-http
after posting this and am using my own implementation of useFetch
that is just a light wrapper on fetch
.