AJAX. How to pick up with PHP the data sent by "username" and "password" when set in ajax?

Question

I know you have other ways to send and get Ajax-PHP data, but giving a read in the documentation of jQuery-Ajax I saw that you have the option of username and password, where I understood gives a security when sending this type of information to the server (PHP). You may have misunderstood the actual workings, but anyway...

I know the values taken by the form in username and password in ajax, but I do not know how to rescue them in PHP. Sending via POST, but as I don’t pass any key, I have no idea how to get in PHP.

I would like a help and if possible an explanation about using the username and password in ajax, if it really provides more security when performing the request, different from other ways of sending data to the server.

jQuery-Ajax.

            $.ajax({
                type: 'POST',
                url: 'dados.php',   

                // Passando o username vindo do formulário.
                username: $('#username').val(), 

                // Passando o password vindo do formulário.
                password: $('#password').val(), 

                success: (resp) =>{
                     // Em caso de sucesso...
                },
                error: (resp) =>{
                    // Em caso de erro...
                },

            });

PHP.

<?php

    // Como que pego os dados passados pelo username e password?
    // Já tentei utilizar o $_POST['username'] e $_POST['password'], mas não pega nada.
    $user = $_POST['??????????'];
    $pass = $_POST['??????????'];

    if ($user == "" || $pass == "") {
        echo "Nenhum campo pode ficar vazio.";
    } else {
        echo "Seu username: ".$user.", password: ".$pass;
    }

?>

Answer 1

let’s "refactor" your code:

var strObjeto = JSON.stringify({
            username: $('#username').val(), 
            password: $('#password').val(), 
            });

            function salvaRegistroAdicional(){
                $.ajax({
                    type: "POST",
                    url: "dados.php",
                    data: strObjeto,
                    contentType: "application/json; charset=utf-8",
                    dataType: "json",
                    success: function (response) {
                        if (response) {
                            //trata a resposta
                            alert("Salvo com sucesso!");
                        }else{
                            alert(response.error);                    
                      }
                    },
                    error: function(){
                        alert(error.message);
                    }
                });
            };
            salvaRegistroAdicional();

This way you will make the request:

in your form dados.php, you will be able to recover the data in this way

$user = $_POST['username'];
$pass = $_POST['password'];

you can check the return in the network tab of the browser Devtools.