How to submit a data array to an reactjs app by url

Question

my react level is very low and I am searching for a solution for this:

Right now, I open a react app by an url: http://localhost:3000/campaigns/create?param1=abc&param2=123&param3=abc123. The url params contain data from a caller outside my app. This works fine for one entity of data params from the url. I parse it to an json object, like so:

{
  "param1": "abc",
  "param2": "123",
  "param3": "abc123"
}

What do I do, if the caller wants to submit 1 to n entities by calling the url in the browser, so that I get an result object as array:

[{
  "param1": "abc",
  "param2": "123",
  "param3": "abc123"
},{
  "param1": "abc",
  "param2": "123",
  "param3": "abc123"
}]

What is the common way to send data to an url, without calling http endpoints from inside the react app? I use react 16.10.

As I learned so far, there basically is no way to POST data to a browser client, without a backend. HTTP does have a request body for GET request, but it is not recommended to do so: https://stackoverflow.com/questions/978061/http-get-with-request-body. — Mathias Methner, Oct 09 '19 at 12:17

Bhojendra Rauniyar · Accepted Answer · 2019-10-08T15:28:49.647

0

You can repeat the parameters:

http://localhost:3000/campaigns/create?
param1=abc&param1=abc&param2=123&param2=123&param3=abc123&param3=abc123

Now, you'll get the array of parameters:

param1 = ['abc', 'abc'] // and like so

It is better to indicate users/api that parameter contains value of array:

param1[]=abc&param1[]=abc

edited Oct 08 '19 at 15:28

answered Oct 08 '19 at 15:09

Thanks for your answer, that would work. But in my case I actually want to get rid of the url parameters. (That is not clear in the question I asked) – Mathias Methner Oct 09 '19 at 12:19
Your comment made me surprise then. You would need to use POST request. – Bhojendra Rauniyar Oct 09 '19 at 13:08
You are right. What I found out since two days of intense research, that there is no way of submitting data as a GET request to the client, beside the url itself and url params, like you pointed to. So your answer helped me a lot. – Mathias Methner Oct 10 '19 at 14:05

1 Answers1