1

Тема: React+Express. get || post запит з багатьма параметрами

Запитання полягає в площі передачі багатьох параметрів в запиті get, поясніть, будь ласка, яким чином?

Коли це один параметр (наприклад id), та й ще коли він обов'язковий, проблем немає:

На клієнті:

export const getOneData = async (id) => {
  const result = await $host.get(`api/src/${id}`)
  return result.data
}

На сервері, я беру з параметрів const id = req.params.id і все ок.

Але коли є пошукова форма з великою кількістю параметрів (select, checkbox і т.д.) і не відомо що там буде вибрано чи натиснуте. Як передавати?

Наразі передаю через post, тому що там є параметр data і отримую адекватну відповідь.

export const getAllSearchData = async (param1, param2, param3) => {
  const result = await $host.post(`api/src`, {param1, param2, param3})
  return result.data
}

Якщо через post отримувати дані цілком комільфо - тоді ок, але якщо отримувати дані треба через get, то підскажіть, будь ласка, як передавати всі ті параметри.
Дякую.

2

Re: React+Express. get || post запит з багатьма параметрами

а шо саме ви використовуєте для http запитів на стороні клієнта?

3

Re: React+Express. get || post запит з багатьма параметрами

FakiNyan написав:

а шо саме ви використовуєте для http запитів на стороні клієнта?

axios

4

Re: React+Express. get || post запит з багатьма параметрами

А чому б не передавати JSON, умовно (я гадки не маю, як воно в React-і):

export const getOneData = async (data) => { //data - це об'єкт на кшталт {id:10,param:20}
  const result = await $host.get(`api/src/${JSON.stringify(data)}`)
  return result.data
}

а на сервері, відповідно,

const data = JSON.parse(req.params.id); //id перейменувати на ваш смак - може, в те саме data

5

Re: React+Express. get || post запит з багатьма параметрами

jsfd написав:
FakiNyan написав:

а шо саме ви використовуєте для http запитів на стороні клієнта?

axios

Якщо оцей $host є екземпляром axios, то імовірно GET запит з параметрами робиться так (принаймні я так робив):

$host.get(url, {params: {id, param1, param2}});

Точніше я свої запити до ендпоїнтів реалізовував у вигляді файлу api.js, що містить об'єкт, що містить функції типу такого:

const api = {
    ...
    newfolder(data) {
        return http.get('/api/newfolder',  { params: data });
    }
    ...
}

Де в data я передаю об'єкт з параметрами.
До речі з POST запитами дещо складніше там не обійшлося без допоміжних функцій, які б імітували відправку форми... на роботі в мене замість цього використовають відправку json, але там свої нюанси.

Подякували: leofun01, jsfd2

6

Re: React+Express. get || post запит з багатьма параметрами

Koala, дякую за ідею з JSON
bvn, саме так оцей $host є екземпляром axios, дякую за ваш варіант.

До речі, не відчув складностей з postзапитом, все працює коректно, але внутрішнє переконання, що так напевно не роблять, що post- це для insert, put- для update, delete- відповідно delete, а для отримання даних має бути get.

7

Re: React+Express. get || post запит з багатьма параметрами

Варіянт bvn правильніший, ті параметри в тілі url звуться query parameters, можете гуглити axios query parameters, шоб побачити більше прикладів