ajax 之POST请求，参数序列化

最新推荐文章于 2023-07-19 15:22:27 发布

aechi62008

最新推荐文章于 2023-07-19 15:22:27 发布

阅读量394

点赞数

文章标签： javascript json 前端 ViewUI

原文链接：http://www.cnblogs.com/daowangzhizhu-pt/p/6437194.html

版权

比如，，我们在没有使用jquery的时候，没有$.post来让我们使用，那我们像下面这样直接发送：

var params1 = {
        username: username,
        passwrod: password
    };
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function () {
    if (xhr.readyState == 4 && xhr.status == 200) {
        var data = xhr.responseText;
        data = JSON.prase(data);
    console.log(data);
    }
}
xhr.open("POST","/url",true);
xhr.setRequestHeader('Content-Type', 'multipart/x-www-form-urlencoded; charset=UTF-8');
xhr.send(params1);

这样发送，后台是接受不到数据的，，因为数据藏在Request的body中，而不是表单中，
所以我们前端就要对数据进行序列化，像jquery一样，$.params 一样对json序列化，这样后台就可以收到了

就像这样：

var params1 = {
        username: username,
        passwrod: password
    };
function $params(obj) {
    var str = [];
    for (var p in obj) {
        str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
    }
    return str.join("&");
}
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function () {
    if (xhr.readyState == 4 && xhr.status == 200) {
        var data = xhr.responseText;
        data = JSON.prase(data);
    console.log(data);

    }
}
xhr.open("POST","/url",true);
xhr.setRequestHeader('Content-Type', 'multipart/x-www-form-urlencoded; charset=UTF-8');
xhr.send($params(params1));

写下来，送给无知的自己。。
来自：http://news.17173.com/

转载于:https://www.cnblogs.com/daowangzhizhu-pt/p/6437194.html