Query string with fetch javascript

Question 1

I'm working on a project and i want to define url object that will be passed to fetch ex.https://t1.testing.com/test/api/v1/blog?pagingindex=0&pagingresults=10

const url_object = {  url: `https://t1.testing.com/test/api/v1/blog`,  url_params: {    method: "POST",    pagingindex: 0,    pagingresults: 10  }};

and when i callfetch(url_object.url, url_object.url_params) i get an error. How can i incorporate this into fetch? So i need to allow user to define method and query string that will be passed. Thanks in advance!

Question 2

What is the error?

Question 3

Have you tried just passing that same URL tofetch as the URL argument? BTW,fetch does not allow for properties in its initialization object other than those documented, and it takes two arguments: the URL, then the initialization object.

Question 4

Possible duplicate ofSetting query string using Fetch GET request

Question 5

You can have your cake and eat it too -- easily convert dictionary style objects to query parameters with no fuss:

var url = new URL('https://example.com/');url.search = new URLSearchParams({blah: 'lalala', rawr: 'arwrar'}); console.log(url.toString()); // https://example.com/?blah=lalala&rawr=arwrar

Question 6

This only works with absolute URLs. If you try a relative URL it falls apart.

Question 7

I get a TS errorType 'URLSearchParams' is not assignable to type 'string'.ts(2322) (property) URL.search: string

Question 8

The object you have labeledurl_params is described by theMDN documentation as:

An options object containing any custom settings that you want to apply to the request.

It then goes on to list the properties you can include there.

pagingindex andpagingresults are not among them.

The query string is part of the URL. If you want to put data there, then put itin the URL.

const url_object = {  url: `https://t1.testing.com/test/api/v1/blog?pagingindex=0&pagingresults=10`,  url_params: {    method: "POST"  }};

You may wish to usethe URL object to construct the URL (it will handle escaping for you).

Question 9

To be clear, the call tofetch should befetch(url_object.url, url_object.url_params) if that object is to be used correctly. I know that wasn't part of the question, but for future readers who may not know how the OP was using that might pass that object verbatim tofetch and wonder why it doesn't work.

Question 10

Yea i know that, when i pass it like you did it wokrs fine, but i dont want to hardcode it like that because it will need to be dynamic. I will try it with URL object.

jfunk 8,2724 gold badges43 silver badges41 bronze badges · Accepted Answer · 2019-08-16 18:35:15Z

You can have your cake and eat it too -- easily convert dictionary style objects to query parameters with no fuss:

var url = new URL('https://example.com/');url.search = new URLSearchParams({blah: 'lalala', rawr: 'arwrar'}); console.log(url.toString()); // https://example.com/?blah=lalala&rawr=arwrar

This only works with absolute URLs. If you try a relative URL it falls apart.
I get a TS errorType 'URLSearchParams' is not assignable to type 'string'.ts(2322) (property) URL.search: string

Movatterモバイル変換

Collectives™ on Stack Overflow

Query string with fetch javascript

2 Answers2

2 Comments

2 Comments

Your Answer

Sign up orlog in

Post as a guest

Linked

Related

Hot Network Questions

Subscribe to RSS