web-dev-qa-db-ja.com

JQueryを使わずに、JSONをサーバーに送信し、JSONを取得する

JQueryを使用せずに、JSON（これを文字列化することができます）をサーバーに送信し、結果のJSONをユーザー側で取得する必要があります。

GETを使用する必要がある場合、JSONをパラメータとして渡す方法は？それが長すぎるというリスクがありますか？

POSTを使用する必要がある場合、GETでonload関数と同等のものを設定するにはどうすればよいですか。

それとも別の方法を使うべきですか？

REMARK

この質問は単純なAJAXを送信することではありません。重複して閉じるべきではありません。

javascriptjsonpostgetxmlhttprequest
83
Jérôme Verstrynge

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": "[email protected]", "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": "[email protected]", "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);
?>

HTTP Get要求の長さの制限は、使用されるサーバーとクライアント（ブラウザー）の両方に依存します（2 KBから8 KB）。 URIがサーバーが処理できる長さよりも長い場合、サーバーは414（Request-URI Too Long）ステータスを返す必要があります。

注州の値の代わりに州の名前を使用できると誰かが言っています。言い換えれば、私はxhr.readyState === xhr.DONEの代わりにxhr.readyState === 4を使用することができます。問題は、Internet Explorerが異なる状態名を使用するので、状態値を使用する方が良いことです。

168
hex494D49

新しいAPIを使う フェッチ ：

const dataToSend = JSON.stringify({"email": "[email protected]", "password": "101010"});
let dataRecieved=""; 
fetch("",{credentials:'same-Origin',mode:'same-Origin',method:"post",body:dataToSend})
              .then(resp => {
                if(resp.status==200){
                   return resp.json()
                }else{
                    console.log("Status: "+resp.status);
                    return Promise.reject("server")
                }
              })
           .then(dataJson =>{
                 dataToRecieved = JSON.parse(dataJson);
             })
              .catch(err =>{
                if(err=="server")return
                console.log(err);
            })
0
John Balvin Arias