向服务器发送一个 JSON,并在不使用 JQuery 的情况下返回一个 JSON

我需要向服务器发送一个 JSON (我可以对其进行字符串化) ,并在用户端检索结果 JSON,而不使用 JQuery。

如果我应该使用 GET,那么如何将 JSON 作为参数传递?会不会太久了?

如果我应该使用 POST,那么如何在 GET 中设置与 onload函数等效的函数?

或者我应该用另一种方法?

备注

这个问题不是关于发送一个简单的 AJAX。它不应该作为重复关闭。

326594 次浏览

使用 POST 方法以 JSON 格式发送和接收数据

// Sending and receiving data in JSON format using POST method
//
var xhr = new XMLHttpRequest();
var url = "url";
xhr.open("POST", url, true);
xhr.setRequestHeader("Content-Type", "application/json");
xhr.onreadystatechange = function () {
if (xhr.readyState === 4 && xhr.status === 200) {
var json = JSON.parse(xhr.responseText);
console.log(json.email + ", " + json.password);
}
};
var data = JSON.stringify({"email": "hey@mail.com", "password": "101010"});
xhr.send(data);

使用 GET 方法以 JSON 格式发送和接收数据

// Sending a receiving data in JSON format using GET method
//
var xhr = new XMLHttpRequest();
var url = "url?data=" + encodeURIComponent(JSON.stringify({"email": "hey@mail.com", "password": "101010"}));
xhr.open("GET", url, true);
xhr.setRequestHeader("Content-Type", "application/json");
xhr.onreadystatechange = function () {
if (xhr.readyState === 4 && xhr.status === 200) {
var json = JSON.parse(xhr.responseText);
console.log(json.email + ", " + json.password);
}
};
xhr.send();

使用 PHP 在服务器端处理 JSON 格式的数据

<?php
// Handling data in JSON format on the server-side using PHP
//
header("Content-Type: application/json");
// build a PHP variable from JSON sent using POST method
$v = json_decode(stripslashes(file_get_contents("php://input")));
// build a PHP variable from JSON sent using GET method
$v = json_decode(stripslashes($_GET["data"]));
// encode the PHP variable to JSON and send it back on client-side
echo json_encode($v);
?>

HTTPGet 请求的长度限制取决于所使用的服务器和客户端(浏览器) ,从2kB 到8kB。如果 URI 比服务器能够处理的长,服务器应该返回414(Request-URI Too Long)状态。

注意 有人说我可以使用状态名而不是状态值,换句话说我可以使用 xhr.readyState === xhr.DONE而不是 xhr.readyState === 4问题是 Internet Explorer 使用不同的状态名,所以最好使用状态值。

使用新的 api 捡回来:

const dataToSend = JSON.stringify({"email": "hey@mail.com", "password": "101010"});
let dataReceived = "";
fetch("", {
credentials: "same-origin",
mode: "same-origin",
method: "post",
headers: { "Content-Type": "application/json" },
body: dataToSend
})
.then(resp => {
if (resp.status === 200) {
return resp.json()
} else {
console.log("Status: " + resp.status)
return Promise.reject("server")
}
})
.then(dataJson => {
dataReceived = JSON.parse(dataJson)
})
.catch(err => {
if (err === "server") return
console.log(err)
})


console.log(`Received: ${dataReceived}`)                
您需要处理当服务器发送其他状态而不是200(ok)时,您应该拒绝该结果,因为如果您将其保留为空白,它将尝试解析 json,但是没有解析,所以它将抛出一个错误