Question

<!doctype html>
<head>
</head>

<body>
<script>
    const Http = new XMLHttpRequest();
    const url='http://localhost:4550/users';
    Http.open("POST", url);
    Http.send("hey");

    Http.onreadystatechange = (e) => {
        console.log(Http.responseText)
    }
</script>

</body>
</html>

//user.js
var express = require('express');
var router = express.Router();

var array = [];

/* GET users listing. */
router.get('/', (req, res, next) => {
  res.send('respond with a resource1');
});

router.post('/', (req, res, next) => {
  res.send('respond with a resource2');
});

module.exports = router;

//app.js
const express = require('express')

const app = express();

app.get('/',(req,res)=> {
  console.log('lior');
  res.send('api running 2')});

app.use('/users',require('./routes/users'))

app.use(function(req, res, next) {
  var err = new Error('Not Found');
  err.status = 404;
  next(err);
});

const PORT = process.env.PORT || 4550;

app.listen(PORT,()=> console.log('server started on port ${PORT}'));

我是连接客户端和服务器端的新手，这也许就是为什么我找不到我的问题的答案的原因。是一个简单的问题。

如您所见，我想将“嘿”从客户端发送到服务器（user.js）。但是我不知道如何在服务器端捕获响应。

我知道代码“嘿”或两者都不是很有意义，但这只是使事情变得简单的一个例子，我只是想知道服务器端如何捕获和处理数据。

谢谢！

Answer 1

发布数据时，请指定编码方式。通常最好使用标准编码方法，而不要发布纯文本。（也不要以大写字母开头的变量名，除非它们是构造函数）

const http = new XMLHttpRequest();
const url = 'http://localhost:4550/users';
const data = JSON.stringify({ value: "hey" });
http.open("POST", url);
http.setRequestHeader("Content-Type", "application/json");
http.send(data);

http.onreadystatechange = (e) => {
    console.log(http.responseText)
}

然后在服务器端代码中，使用body parser对数据进行解码。

由于您在请求中使用了绝对URL，因此您似乎在创建cross-origin request，因此还需要使用CORS授予权限。

const express = require('express')
const bodyParser = require('body-parser')
const cors = require('cors')
const app = express()
const port = 4550

const jsonParser = bodyParser.json()

const corsOptions = {
    origin: 'http://example.com',
    optionsSuccessStatus: 200
};

const corsMiddleware = cors(corsOptions)

app.get('/', (req, res) => res.send('Hello World!'))

app.get('/users', (req, res, next) => {
    res.send('respond with a resource1');
});

app.options("/users", corsMiddleware)

app.post('/users', corsMiddleware, jsonParser, (req, res, next) => {
    // data is in `req.body` (which will have a `value` property because the object on the client does)
    res.send('respond with a resource2');
});

app.listen(port, () => console.log(`Example app listening on port ${port}!`))

（以上内容未经测试，可能有小错误）

Answer 2

请发送如下序列化数据：

const http = new XMLHttpRequest();
const url = 'http://localhost:4550/users';
const data = JSON.stringify("hey");
http.open("POST", url);
http.setRequestHeader("Content-Type", "application/json");
http.send(data);

您需要使用bodyParser软件包

npm install body-parser

const bodyParser = require("body-parser");

在设置路线之前，请按以下方式使用它：

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));

别忘了允许标题声明如下：

app.use((req, res, next) => {
  res.setHeader("Access-Control-Allow-Origin", "*");
  res.setHeader(
    "Access-Control-Allow-Headers",
    "Origin, X-Requested-With, Content-Type, Accept"
  );
  res.setHeader(
    "Access-Control-Allow-Methods",
    "GET, POST"
  );
  next();
});

现在您可以按以下方式读取数据

router.post('/users', (req, res, next) => {
  console.log(req.body);
});

Answer 3

您要创建发布端点

router.post('/users', (req, res, next) => {
  res.send('respond with a resource2');
});

如何在后端捕获POST请求？

3 个答案: