gpt4 book ai didi

javascript - Node.js 和 Express : Pushing to array results in "[object Object]"

转载 作者:行者123 更新时间:2023-12-03 06:51:34 26 4
gpt4 key购买 nike

我是网络开发新手,正在学习相关类(class)。在挑战主要项目之前,我正在设计一个测试网络服务器。对于此测试,我尝试从文本 block 中获取值,并将其附加到响应部分,同时进行此操作,以便刷新页面时不会丢失数据。

当前,当我按下按钮时,它会附加:[object Object][object Object][object Object]

下面是我用于此应用程序的 3 个文件

首先是index.html:

<html>
<head>
<title> Website Test </title>
</head>
<body>
<h1> Website Test </h1>
<p> press the button </p>
<input type="text" id="input_block">
<button id="test_button" onclick="sendData(document.getElementById
('input_block').value)"> Press Me Now </button>
<p id="response"></p>

<script type="text/javascript" src="myScript.js"></script>
</body>
</html>

接下来是静态服务器程序:

var express = require("express");
var bodyParser = require("body-parser");

var app = express();

app.use(bodyParser.json());

app.use(express.static('public'));

var myData = [];

app.get("/data", function(req, res){
console.log(req.body);
res.json(myData).ProjectName;
});

app.post("/data", function (req, res){
console.log("POST Request to: /");
console.log(req.body);
res.send(req.body);
myData.push(req.body);
});

app.listen(3000, function() {
console.log("listening on port 3000");
})

最后是 script.js:

function getData() {
var xhr = new XMLHttpRequest();
xhr.open("GET", "/data", true)
xhr.send();

xhr.onreadystatechange = function(){
if (xhr.readyState == 4 && xhr.status == 200){
// got a response
console.log(xhr.responseText);

var arr = JSON.parse(xhr.responseText);
console.log(arr);

var s = "";
for (var i = 0; i < arr.length; i++) {
s+=arr[i];
}

document.getElementById("response").innerHTML = s;

}
};
}
function sendData(project_name){
console.log("sending POST to /data");
var obj = { ProjectName : project_name, ActivityName : "bites" };
var postXhr = new XMLHttpRequest();
postXhr.open("POST", "/data", true);
postXhr.setRequestHeader("Content-type", "application/json");
postXhr.send(JSON.stringify(obj));
getData();
}
getData();

对此问题的任何回应将不胜感激。如果有人看到将来可能会出现问题的内容,请发表评论。谢谢!

最佳答案

出现[object Object]意味着you're converting objects to strings .

这可能发生在客户端,s+=arr[i]:

var s = "";
for (var i = 0; i < arr.length; i++) {
s+=arr[i];
}

要显示一个普通的对象,您必须找到或创建一些东西来格式化它。一种选择是将它们转换回 JSON:

s+=JSON.stringify(arr[i]);

或者,访问不是另一个对象的对象的属性。

s+=arr[i].ProjectName;
<小时/>

此外,这行服务器端不会执行您可能期望的操作:

res.json(myData).ProjectName;

如果您只想将项目名称发送给客户端,则必须迭代该数组并创建另一个数组。您可以使用 .map() 来做到这一点.

res.json(myData.map(d => d.ProjectName));

关于javascript - Node.js 和 Express : Pushing to array results in "[object Object]",我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37474513/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com