没有jquery的Ajax json请求

Question

I use a file backend.php

echo json_encode(array('post' => $_POST));

And javascript for an ajax request:

function ajax_(requst) {
    requst = requst || {};
    var result = {};
    (function () {
        var xhttp = window.XMLHttpRequest ? new XMLHttpRequest() :
                new ActiveXObject("Microsoft.XMLHTTP");
        xhttp.onreadystatechange = function () {
            if (xhttp.readyState === 4 && xhttp.status === 200) {
                result = JSON.parse(xhttp.responseText);
                //result = (xhttp.responseText);
            } else {
                result = {
                    error: 'status="'+xhttp.statusText+' ('+xhttp.status+')", state="'+xhttp.readyState+'"'
                };
            }
        };
        xhttp.open(requst.type || 'POST', 'backend.php', false);
        xhttp.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
        //xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        xhttp.send(requst.data);
    })();
    return result;
}

And also the request using

console.log('before');
console.log(ajax_({
    data: {
        a: 1,
        b: {
            b1: [],
            b2: {},
            b3: 'b3'
        }
    }
}));
console.log('after');

How to achieve that the console displays the

before
Object { post: a: 1, b: {b1: [], b2: [], b3: 'b3'}
after
?

Problem is that json sending doesn't work. Works only json got from back end.

Answer 1

You can't send an object in AJAX.

<script>
    function ajax_(requst) {
        requst = requst || {};
        var result = {};
        var xhttp = window.XMLHttpRequest ? new XMLHttpRequest() :
        new ActiveXObject("Microsoft.XMLHTTP");
        xhttp.onreadystatechange = function () {
            if (xhttp.readyState === 4 && xhttp.status === 200) {
                result = JSON.parse(xhttp.responseText);
                //result = (xhttp.responseText);
            } else {
                result = {
                    error: 'status="'+xhttp.statusText+' ('+xhttp.status+')", state="'+xhttp.readyState+'"'
                };
            }
        };
        xhttp.open(requst.type || 'POST', 'backend.php', false);
        //xhttp.setRequestHeader("Content-Type", "application/json;charset=UTF-8");
        xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        xhttp.send('data='+JSON.stringify(requst.data));
        return result;
    }

    console.log('before');
    console.log(ajax_({
        data: {
            a: 1,
            b: {
                b1: [],
                b2: {},
                b3: 'b3'
            }
        }
    }));
    console.log('after');
</script>

And for the backend.php

<?php echo $_POST['data'];