1

Требуется силами ванильного JS передать на PHP сервер через POST-запрос объект так, чтобы PHP сам его распознал и разместил в массиве $_POST.

Если я хочу передать в теле простой объект вида: {name1: 'value1', name2: 'value2'}
то мне достаточно будет преобразовать его к строке: 'name1=value1&name2=value2' и умный PHP всё сделает сам.

А если мне необходимо передать составной объект следующего вида:

{
  name1:{
    name1sub1: 'value1sub1',
    name1sub2: 'value1sub2',
  },
  name2:{
    name2sub1: 'value2sub1',
    name2sub2: 'value2sub2',
  }
}

то каким образом это запаковать в строку такого же формата, как и в первом случае, чтобы к объекту можно было обратиться через $_POST?

По-любому способ должен быть, ведь JQ это как-то делает :-)

Да, я понимаю, что любую необработанную информацию можно получить через file_get_contents('php://input'), но мне необходимо правильно всё передать на стороне клиента.

3

3 ответа 3

1

то каким образом это запаковать в строку такого же формата, как и в первом случае, чтобы к объекту можно было обратиться через $_POST?

Использовать JSON.stringify().

Вот так:

var j = {
  name1: {
    name1sub1: 'value1sub1',
    name1sub2: 'value1sub2',
  },
  name2: {
    name2sub1: 'value2sub1',
    name2sub2: 'value2sub2',
  }
};
// Замените на ваш URL
var url = 'https://jsonplaceholder.typicode.com/posts';

fetch(url, {
    method: 'post',
    headers: {
      "Content-type": "application/json; charset=UTF-8"
    },
    body: JSON.stringify(j) // Упаковка

  }).then(response => response.json()) // Ответ с сервера переводится в JSON
  .then(res => console.log(res))
  .catch(function(err) {
    // Error :(
  });

2
  • 1
    Хороший ответ, работает, но мне нужен был код чуть ниже уровнем. Я бы плюсанул, если бы репутация позволяла... Но более точный и обширный ответ дал Eliot - за счет этого ответа можно понять, как оно там за ширмой вообще работать должно :-)
    – Lex
    17 июл 2018 в 15:10
  • @Lex чтобы понимать как что работает, за ширмой читают, документацию как минимум.
    – Kosta B.
    17 июл 2018 в 15:40
0

Ну во-первых я думаю что объект будет лучше отправлять в формате json(если не известно что это то внизу будет ссылка) А что касается отправки данных на сервер, то стоит воспользоваться Ajax Вот код а объяснение ниже

var body = "jsonstr=" + 
encodeURIComponent(jsonstr);
var xhr = new XMLHttpRequest();
xhr.open("POST", "file.php", true);
xhr.setRequestHeader('Content-Type', 
'application/x-www-form-urlencoded');
xhr.send(body);

body это сам наш запрос который мы посылаем на сервер xhr это объект с помощью которого мы будем отправлять данные на сервер xhr.open это метод который открывает соединение с сервером. Первый параметр это метод отправки, второй php файл к которому идёт запрос, третий это асинхронное выполнение кода (если false то синхронное) Следующая строка присваивает кодировку запроса xhr.send отправляет запрос Надеюсь всё более менее понятно Ссылки: Здесь целый раздел посвящённый ajax: https://learn.javascript.ru/ajax Навсякий случай подробнее про json: https://learn.javascript.ru/json

2
  • Супер! Есть два ключевых момента, на которые потомкам рекомендую обратить внимание. 1. Строка с json начинается с названия параметра и знака равно: "jsonstr=" - это позволяет на стороне сервера обратиться к массиву по данному ключу, чтобы выловить строку перед декодированием: $obj = json_decode($_POST['jsonstr']). 2. Элемент строки json справа от "jsonstr=" обязательно прогонять через encodeURIComponent(), чтобы случайный амперсанд в строке-значении объекта не разрушил весь json. То есть сначала var jsonstr = JSON.stringify(jsonobj), а потом var body = encodeURIComponent(jsonstr).
    – Lex
    17 июл 2018 в 15:06
  • Костыли-костылики
    – andreymal
    17 июл 2018 в 15:38
-1
var xhr = new XMLHttpRequest();
var data = {
  name1:{
    name1sub1: 'value1sub1',
    name1sub2: 'value1sub2',
  },
  name2:{
    name2sub1: 'value2sub1',
    name2sub2: 'value2sub2',
  }
};
xhr.open('POST', '/yourUrl');
xhr.send(JSON.stringify(data));

Подробнее о XMLHttpRequest тут, о JSON тут Главное - не забудьте разобрать ответ как json на стороне сервера, например вот так:)

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.