Comments (14)
For better or worse, this page is the first result when you google "whatwg fetch url params". Just trying to save future googlers some potentially wasted time.
from fetch.
@annevk, the URL objects do not have that .searchParams
property. These are the fixes it requires:
function urlWithParams(urlString, params={}) {
var url = new URL(urlString);
var searchParams = new URLSearchParams();
Object.keys(params).forEach((key) => {
searchParams.append(key, params[key]);
});
url.search = searchParams.toString();
return url.toString();
}
Object.keys will return an array and the values will be lost in the foreach callback. I leave this function that maybe useful for those who want to add params to a url
from fetch.
That's a Chrome bug, not really relevant to the spec.
from fetch.
superagent is much simpler, \o/
from fetch.
Edit: see https://fetch.spec.whatwg.org/#fetch-api for a working example.
Example could be something like:
var url = new URL("https://example.org/api"),
params = { first: "x", second: "y" }
Object.keys(params).forEach((key, value) => { url.searchParams.append(key, value) })
fetch(url).then(/* ... */)
from fetch.
URL
objects don't seem to have a .searchParams
property, at least not in Chrome 48.
from fetch.
See the last three comments prior to yours.
from fetch.
I just wanted to leave here a working example ...
from fetch.
Ah, that makes sense! Hopefully Chrome fixed their bug soon...
from fetch.
Agreed :)
from fetch.
@kopz9999 has worked in Firefox for ages. \o/
from fetch.
@annevk, I agree on the part of searchParams
in Firefox, but this part is wrong:
Object.keys(params).forEach((key, value) => { url.searchParams.append(key, value) })
This part will always put the index as a value: "https://example.org/api?first=0&second=1"
I just wanted to leave a working example since this page is one of the first results thrown by google
from fetch.
Ah I see, updated my comment to point to the standard where that is fixed.
from fetch.
Yes, I think that is already fixed on this repo: https://github.com/whatwg/fetch
But google brings this page :P
from fetch.
Related Issues (20)
- CORB is blocked HOT 1
- RequestInit::priority lacks corresponding Request::priority attribute
- Referrer determination should be done on updated URLs in main fetch
- Automatic decompression should sanitize `Content-Encoding` and `Content-Length` headers from the response HOT 1
- When there is an issue with the URL parameter, fetch does not have any errors
- add a method to get a Uint8Array to Body HOT 4
- Fetch with Flask or Microdot HOT 1
- Service worker "handle fetch" seems to assume it's called in parallel HOT 2
- Redirect loop handling not discussed
- Add compression dictionary negotiation and decoding to the fetch processing model HOT 2
- Reconsider default Accept values for images
- Fetch support for explicit resource management
- Consider renaming or replacing http3only? HOT 1
- [render-blocking] The links of "render-blocking" in fetch are vague HOT 2
- Define what consequences NULL bytes (0x00) or other invalid values in header names have HOT 1
- 0x00 byte (%00) in a data: URL
- fetch does not allow caching requests with a null client HOT 1
- Question about stream handling around fetch requests with integrity metadata HOT 3
- Allow `new Response` with 101 status code HOT 6
- Question regarding preflight requests using the original request destination HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from fetch.