2017-06-05 6 views
1

現在、特にNode.jsとExpressを使用してサーバーコードについて詳しく教えています。受信と解析に多くの問題がありますPOSTリクエストから送信されたJSONオブジェクト。私は他の多くの記事を見てきました(以下にリンクされています)、私の人生について何が間違っているのか分かりません。POSTからPOSTリクエストからJSONオブジェクトを解析して、ボディパーサーを使用してExpress v4に入れようとしています

Javascriptを::AJAXとJSONオブジェクトを送信 Javascript : Send JSON Object with Ajax? 私はExpressアプリケーションでのXMLHttpRequest Send POST data using XMLHttpRequest を使用して How do I consume the JSON POST data in an Express application 送信POSTデータをJSON POSTデータを消費するにはどうすればよいあなたはPOSTを抽出するにはどうすればよいここで私が見てきたものですNode.jsのデータ? How do you extract POST data in Node.js?

これらのすべてが正しい軌道に乗っていますが、私はそこにはないので、助けを求めています。私はREQ」の内容をプリントアウトしようとするたびにサーバーにハンドルポスト要求

var http = require("http"); 
var fs = require("fs"); 
var express = require("express"); 
var app = express(); 
var path = require("path"); 
var bodyParser = require("body-parser"); 

var port = process.env.PORT || 3000; 
//tells express where to find all the static files (HTML, CSS, etc) and load them into the browser 
app.use(express.static(path.join(__dirname, '../client'))); 

//tells the application to use body-parser as middleware so it can handle post requests 
app.use(bodyParser.urlencoded({extended: true})); 
app.use(bodyParser.json()); 

//routing methods 
//deal with incoming GET and POST requests to the server 
app.get("/", function(req, res){ 
    res.send("Submitted GET Request"); 
}) 

//only handles incoming POST requests to the test.json resource 
app.post("/data/test.json", function(req, res){ 
    console.info("Submitting POST Request to Server"); 
    console.info("Request body: " + req.body); 
    //write the file 
    fs.writeFile(__dirname + "/../client/data/test.json", req.body, 
    function(err){ 
     if(err){ 
      console.error(err); //print out the error in case there is one 
      return res.status(500).json(err); 
     } 

     //resolve the request with the client 
     console.info("updated test.json"); 
     res.send(); 
    }); 
}) 

//tell the express object to create the server and listen on the port 
app.listen(port); 
console.log("Listening on localhost:" + port); 

送信POSTリクエスト

var button = document.querySelector("#button"); 

button.onclick = function(){ 
    console.log("Getting data from local server"); 

    var xhr = new XMLHttpRequest(); 

    xhr.open("POST", "http://localhost:3000/data/test.json", true); 
    xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); 
    xhr.send(JSON.stringify({"latitude": 41.2418, "longitude": -70.8898})); 
}; 

:ここでは私が働いているコードです.body "" [オブジェクトオブジェクト] "の出力を取得します。何か案は?

編集: 私の問題は解決されました。私は

console.info("Request body: " + JSON.stringify(req.body)); 

console.info("Request body: " + req.body); 

を変更している私はまた、 "アプリケーション/ JSON" にフォーマットを支援するために私のPOST XMLHTTPRequestをして私のContent-Typeを変更しました。

+1

ええと...あなたのコンテンツタイプは、あなたのデータと一致していません... ??? –

+1

このJSON.stringify(req.body)を試してください。 – VivekN

+0

[object object]は、印刷しようとしている変数が文字列ではなく、JSON.stringify(req.body)を使用するだけで簡単に修正できることを意味します。 –

答えて

2

"[object Object]"に次の行

xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"); 

を変更するにはしようとすると、それが使用するJavaScriptの暗黙のtoString操作、デフォルトの結果であり、そのオブジェクトの文字列表現をファイルに書き出します。

JSON.stringify(req.data)をファイルに書き込んでみてください。

また、クライアント側で - 一致させるために、あなたのContent-Typeヘッダーを変更することを検討:

xhr.setRequestHeader("Content-Type", "application/json");

+0

これは私の問題を解決しました!ありがとうございました。 –

-1

あなたのポスト本体がJSONであることが予想されている場合は、

xhr.setRequestHeader("Content-Type", "application/json"); 
+0

[object Object]の問題は解決しませんでしたが、JSONオブジェクトの書式が修正されました。 –

関連する問題