node.js - 如何将数据从客户端的 html 发送到 node.js 服务器?
问题描述
我想将 JSON 数据发送到 node.js 服务器。
这是我的 server.js :
var http = require('http');
var util = require('util')
http.createServer(function (req, res) {
console.log('Request received: ');
util.log(util.inspect(req)) // this line helps you inspect the request so you can see whether the data is in the url (GET) or the req body (POST)
util.log('Request recieved: \nmethod: ' + req.method + '\nurl: ' + req.url) // this line logs just the method and url
res.writeHead(200, { 'Content-Type': 'text/plain','Access-Control-Allow-Origin': '*' });
req.on('data', function (chunk) {
console.log('GOT DATA!');
});
res.end('callback(\'{\"msg\": \"OK\"}\')');
}).listen(8090);
console.log('Server running on port 8090');
这是 html 文件:
<!doctype html>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.8.3.min.js "></script>
</head>
<body>
response here: <p id="lblResponse">fill me in</p>
<script type="text/javascript">
$(document).ready(function() {
$.ajax({
url: 'http://127.0.0.1:8090/',
// dataType: "jsonp",
data: '{ "name":"John", "age":30, "car":null },
type: 'POST',
jsonpCallback: 'callback', // this is not relevant to the POST anymore
success: function (data) {
var ret = jQuery.parseJSON(data);
$('#lblResponse').html(ret.msg);
console.log('Success: ')
},
error: function (xhr, status, error) {
console.log('Error: ' + error.message);
$('#lblResponse').html('Error connecting to the server.');
},
});
});
</script>
</body>
</html>
但我收到此错误:
"VM162:1 Uncaught SyntaxError: Unexpected token c in JSON at position 0
at JSON.parse (<anonymous>)
at Function.parseJSON (jquery-1.8.3.js:514)
at Object.success (file:///home/techm/Desktop/test%20(server-client)/client.html:20:30)
at fire (jquery-1.8.3.js:974)
at Object.fireWith [as resolveWith] (jquery-1.8.3.js:1084)
at done (jquery-1.8.3.js:7803)
at XMLHttpRequest.callback (jquery-1.8.3.js:8518)
我不知道为什么会收到此错误,因为我对 node.js 服务器并不陌生。如果我得到数据,我想将其保存在本地文件中。
解决方案
你的ajax请求应该是这样的
$.ajax({
url: 'http://127.0.0.1:8090/',
data: { "name": "John", "age":30, "car":null },
type: 'POST'
.....
})
在 server.js 的 createServer 方法中更新这个
if (req.method == 'POST') {
console.log("POST");
var body = '';
req.on('data', function (data) {
body += data;
console.log("Partial body: " + body);
});
req.on('end', function () {
console.log("Body: " + body);
});
res.writeHead(200, {'Content-Type': 'text/html'});
res.end('callback(\'{\"msg\": \"OK\"}\')');
}
else
{
console.log("GET");
res.writeHead(200, {'Content-Type': 'text/html'});
res.end('callback(\'{\"msg\": \"OK\"}\')');
}
推荐阅读
- html - 在 Web 服务器上调整 HTML 页面大小的问题
- python - 仅从美丽的汤中提取特定 div 的任何方法
- jenkins - 如何获取删除了几个 Jenkins 作业版本的用户的详细信息?
- java - Apache Tomcat:源服务器没有找到目标资源的当前表示或不愿意透露
- blazor - Blazor 服务器端和单独项目中的模块
- jasny-bootstrap - Jasny 文件上传postedfile 始终为空
- jquery - 在codeigniter中计算jquery ajax中的值
- python - 为什么正则表达式带有“|” (或/替代)顺序切换时匹配不同?
- javascript - Open a different URL in the same window
- ios - 通过 hockey(App Center)或 Fabric 共享时,分布式构建的有效期是多久?