代码之家 › 专栏 › 技术社区 › eric

javascript对象未使用vanilla ajax在php页面上正确发布到$\u POST

ajax php javascript

eric · 技术社区 · 6 年前

我在internet和stackoverflow主题中搜索了答案,但没有找到任何答案。我知道JQuery可以很好地发送对象,但当我尝试在没有框架的情况下也这样做时,我的帖子不会进入PHP页面。

我的两个基本功能是:

function sendAjax(){
    let car = {type:"Fiat", model:"500", color:"white"};
    var myURL = "ajaxpost.php"; 
    var post_data = {
        myData: car
    };
    ajax(myURL, post_data); 
}

function ajax(url, post_data) {
    var params = typeof data == 'string' ? post_data : Object.keys(post_data).map(
        function(k){ return encodeURIComponent(k) + '=' + encodeURIComponent(post_data[k]) }
    ).join('&');

    var xhr = new XMLHttpRequest();
    xhr.open('POST', url, true);
    xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
    xhr.onload = function(){
        if(this.status == 200){
            document.write(this.responseText);
        } 
    }
    xhr.send(params);
}

我在ajaxpost的PHP页面。php包含以下内容

<?php
    $data= $_POST['myData'];
    $results = print_r($data, true);
    echo $results;  // just gives me [object Object]

?>

1 回复 | 直到 6 年前

amphetamachine 6 年前

这是因为 post_data.myData 是一个对象而不是字符串,它通过 encodeURIComponent 像 [Object object] 。

如果你决心使用 www/form-data 编码时,您将需要一个使用递归的函数来正确地转义复杂对象的所有属性和子属性。

我决不会 suggest 使用jQuery,但它有一个方便的函数, $.param(obj) 。

否则,您可以只使用JSON:

var jsonString = JSON.encode(complexObject);

编辑: 我需要实现这个功能,所以我不妨在这里分享一下:

/**
 * Pack up an object of parameters into something that can be added to a GET
 * request.
 *
 * Example:
 * encodeParams({ 'foo': 'bar', 'baz': 'qux' })
 * -> "foo=bar&baz=qux"
 * @param { [key: string]: any } params - key-value store of string->anything
 * @return string URL encoded parameters
 */
var encodeParams = function (params) {
    var up = new URLSearchParams;
    var addParam = function (prefix, param) {
        if (param instanceof Array) {
            for (var _i = 0, param_1 = param; _i < param_1.length; _i++) {
                var i = param_1[_i];
                addParam(prefix + "[]", i);
            }
        }
        else if (param instanceof Object) {
            // add like associative array,
            // e.g. foo[bar][]=baz&foo[bar][]=qux
            for (var i in param) {
                if (param.hasOwnProperty(i)) {
                    addParam(prefix + "[" + i + "]", param[i]);
                }
            }
        }
        else {
            up.append(prefix, (param == null ? '' : param));
        }
    };
    for (var p in params) {
        if (params.hasOwnProperty(p)) {
            addParam(p, params[p]);
        }
    }
    return up.toString();
}; // end encodeParams()