Расшифровать JSON пакет из PHP с помощью AJAX

Question

Я создаю простую систему входа в систему. Я не хочу, чтобы страница перезагружалась, когда пользователь отправляет форму, в случае ошибки, и мне нужно беспрепятственно отображать сообщение об ошибке (например, неправильный пароль). Когда пользователи отправляют данные, AJAX передает их в сценарий submit. php. Этот сценарий проверяет данные, а затем устанавливает объекту JSON номер 1-3 в зависимости от того, что не так или правильно с отправленными учетными данными. Я не знаю, как вызвать AJAX, декодировать JSON, а затем иметь несколько операторов if, которые решают, что делать, на основе значения этого JSON.

Ниже это код, который я использую для формы.

HTML:

    <form method="post" id="myForm">
                 <h1 class="title" unselectable="on">Login</h1>
                     <input placeholder="Username" type="text" name="username" class="form" id="username"/>
                     </br>
                     <input placeholder="Password" type="password" name="password" class="form" id="password"/> 
                     </br>  
                         <input class="button" type="button" id="submitFormData" onclick="SubmitFormData();" value="Submit"/>
                     </br>
    </form>

JS / AJAX (Та же страница):

    function SubmitFormData() {
    var username = $("#username").val();
    var password = $("#password").val();
    $.post("submit.php", { username: username, password: password},
    function(data) {
     $('#results').html(data);
     $('#myForm')[0].reset();
    });
}

Далее идет PHP (представить. php). PHP будет просматривать входящие данные из сценария AJAX, а затем присваивать номер ошибки объекту JSON в зависимости от того, что не так с учетными данными.

           $username = mysqli_real_escape_string($connect, $_POST["username"]);  
           $password = mysqli_real_escape_string($connect, $_POST["password"]);  
           $query = "SELECT * FROM users WHERE username = '$username'";  
           $result = mysqli_query($connect, $query);  
           if(mysqli_num_rows($result) > 0)  
           {  
                while($row = mysqli_fetch_array($result))  
                {  
                     if(password_verify($password, $row["password"]))
                     {  
                          $Obj->error = "three";
                          $myJSON = json_encode($Obj);
                     }  
                     else  
                     {  
                            $Obj->error = "two";
                            $myJSON = json_encode($Obj);
                     }  
                }  
           }
           else {
               $Obj->error = "one";
               $myJSON = json_encode($Obj);
           }
           
           //error one=user not found
           //error two=wrong password
           //error three=all detials are correct

Теперь Проблема, с которой я столкнулся, вернулась на главную страницу, где находится пользователь. Я хочу, чтобы JS посмотрел на переменную $ my JSON и решил, что делать на основе этого. Я написал псевдокод ниже, но я не знаю, смогу ли я сделать это в JS или AJAX.

decode JSON package
if error=one, do something
if error=two, do something else
if error=three, run a php script that sets some session variables. (Is it possible to run php inside of JS?)

. *1015* *1016* *1017* Любая помощь в достижении этих результатов будет принята с благодарностью.

Answer 1

Это ванильное решение javascript:

const xmlhttp = new XMLHttpRequest;
xmlhttp.onreadystatechange = function() {
  if (this.readyState === 4 && this.status === 200) {
    //passes results to a function
    start(JSON.parse(this.responseText));
  }
}
xmlhttp.open("POST", "PHP WEBSITE URL", true);
//sends the request with a FormData object based on the form
xmlhttp.send(new FormData(document.getElementById("myForm")));

function start(object) {
  alert(object);
}

Чтобы это работало, ваш PHP скрипт должен echo ваш объект результата. Пример:

if ($_POST["username"] === "correctUsername" && $_POST["password"] === "correctPassword") {
  //echo javascript object
  echo json_encode(['success'=>true]);
} else {
  //echo javascript object
  echo json_encode(['success'=>false]);
}

Очевидно, что это должно быть более сложным, но это идея.

Я делал страницы входа в систему раньше и вместо того, чтобы возвращать успех, я использовал текущую страницу PHP в качестве основного и повторил информацию для заполнения страницы, а также учетные данные, которые можно использовать с запросами AJAX. Надеюсь, это поможет.