Неопределенные данные при отправке Javascript Object с помощью Ajax - PullRequest
0 голосов
/ 15 декабря 2018

Допустим, я пытаюсь отправить данные в PHP и получить их, используя чистый Javascript.

Итак, когда я отправляю строку "login="+1+"&username="+username+"&password="+password; с помощью Ajax, все нормально, но как насчет Object?в этом случае мой PHP-код всегда говорит, что username и password являются неопределенными индексами.

HTML-документ:

<body>
<form id="loginform">
    <input type="text" placeholder="username"  id="username" required autocomplete="off"><br>
    <input type="password" placeholder="password" id="password" required><br>
    <input type="submit" id="submit">
</form>

<script>
        document.getElementById("loginform").addEventListener("submit", function(e) {
            e.preventDefault();

            var username = document.getElementById("username").value;
            var password = document.getElementById("password").value;

            var data = {// ---- there is my Object -----
                login: 1,
                username: username,
                password: password
            }

            var xhr = new XMLHttpRequest();
            xhr.open("POST", "process.php", true);

            xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');

            xhr.onload = function() {
                console.log(this.responseText);
            }

            xhr.send(data);
        });
</script>
</body>

Документ PHP:

<?php
    if(isset($_POST["login"])) {
        $username = $_POST['username'];
        $password = $_POST['password'];
        echo($username . " , " . $password);
    }
?>

1 Ответ

0 голосов
/ 15 декабря 2018

как насчет объекта?

send() не ожидает передачи простого объекта, поэтому он преобразует его, вызывая метод toString(), который дает вам "[object Object]", который (очевидно) не является URLзакодированные данные.

Мало того, что PHP не понимает этого, но и данные, которые вы хотите отправить, в первую очередь не включаются в него.


Если у вас есть объект,вам необходимо преобразовать его в формат, который вы можете декодировать на сервере.

Продолжать использовать закодированные данные - самый простой подход.

var data = {
  login: 1,
  username: "example",
  password: "example"
};

var key_value_pairs = [];

Object.keys(data).forEach(function(key) {
  key_value_pairs.push(
    encodeURIComponent(key) + "=" + encodeURIComponent(data[key])
  );
})

var url_encoded_string = key_value_pairs.join("&");

console.log(url_encoded_string);

Вы также можете отправлять данные в другом формате.PHP понимает составную MIME-кодировку, которую вы можете сгенерировать с помощью объекта FormData.

var form_data = new FormData(document.getElementById("loginform"));
form_data.append("login", "1");
xhr.send(form_data);

Если вы сделаете это, не переопределяет Content-Type с помощью:

xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');

XMLHttpRequest сгенерирует правильный тип содержимого с помощью составного граничного параметра MIME из объекта FormData.


Вы также можете кодировать данные в другом формате данных, напримеркак JSON:

xhr.setRequestHeader('Content-type', 'application/json');
xhr.send(JSON.stringify(data));

… но , и это большой, но , PHP не знает, как декодировать запросы в формате JSON, и не автоматически заполняется $_POST.

Вам потребуется изменить PHP, чтобы прочитать данные:

$json = file_get_contents('php://input')
$data = json_decode($json));
var_dump($data);
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...