📌  相关文章
📜  express 获取表单 x-www-form-urlencoded - Javascript (1)

📅  最后修改于: 2023-12-03 15:00:40.346000             🧑  作者: Mango

Express获取表单x-www-form-urlencoded

当我们在表单中提交数据时, 默认的提交方式为 x-www-form-urlencoded. 在服务端使用 Express 框架时, 可以非常方便地获取这些表单数据.

代码片段

以下是获取表单数据的示例代码:

const express = require('express');
const bodyParser = require('body-parser');

const app = express();

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

app.post('/submit', (req, res) => {
  const { username, password } = req.body;
  res.send(`Username: ${username}, Password: ${password}`);
});

app.listen(3000, () => {
  console.log('Server is listening on port 3000.');
});

从上面的代码可以看出, 我们需要使用 body-parser 中间件来解析 x-www-form-urlencoded 格式的表单数据. 然后在路由中获取对应的字段即可.

解析表单数据

在上面的示例中, 我们使用了 body-parser 中间件来解析表单数据. body-parser 中间件还支持解析其他格式的数据, 例如 JSONmultipart/form-data.

app.use(bodyParser.json()); // 解析 JSON 格式的数据
app.use(bodyParser.urlencoded({ extended: true })); // 支持解析复杂对象
app.use(bodyParser.text()); // 解析纯文本格式的数据
extended 参数

在使用 body-parser 解析表单数据时, 需要注意 extended 参数的设置. 当 extended 参数为 false 时, req.body 中只包含字符串或数组类型的值, 当为 true 时, 则可以包含任意数据类型的值. 例如:

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

// 当提交以下表单数据时:
// username=test&password=123&age=20
// 获取的内容为:
// req.body = { username: 'test', password: '123', age: '20' }

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

// 当提交以下表单数据时:
// username=test&password=123&age=20
// 获取的内容为:
// req.body = { username: 'test', password: '123', age: 20 }
总结

Express 中获取表单数据非常简单, 只需要使用 body-parser 中间件即可. 另外还需要注意 extended 参数的设置, 如果要支持解析任意数据类型的值, 则需要将其设置为 true.