Write in front
The NodeJS backend is mainly used to implement the addition, deletion, modification, and check of the backend database. Then the addition, deletion, modification, and check of the database needs to rely on the data value passed by our front-end, that is to say, we need to insert a value in the database, and the process of inserting is NodeJS The backend code does it. The specific value to be inserted is the value passed by our front end through ajax or axios, so there is a problem: in the NodeJS backend we have to accept the value passed by the front end. So this article came into being.
Environmental requirements
- Installed the NodeJS environment (you can use the npm package management tool)
- Initialized a NodeJS background project demo
Steps
1. In the back-end interface, we generally use "req.body" to get the parameters passed by the front-end through ajax or axios, but sometimes we find that the parameters are empty when we get them through req.body, so we have to Find a solution, here is recommended to use the body-parser plug-in to solve.
2. First run the command line tool in the root directory of the background project, and then install the plug-in, as follows:
npm install body-parser --save-dev3. Then add the following two lines of configuration code to the index.js file:
var express = require('express');
var app = express();
var bodyParser = require('body-parser'); //首先要引入这个插件
var home = require('./routers/home');
var geocode = require('./routers/geocode');
//设置跨域访问
app.all('*', function(req, res, next) {
res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Headers", "Origin, No-Cache, X-Requested-With, If-Modified-Since, Pragma, Last-Modified, Cache-Control, Expires, Content-Type, X-E4M-With");
res.header("Access-Control-Allow-Methods", "PUT,POST,GET,DELETE,OPTIONS");
res.header("X-Powered-By", ' 3.2.1')
res.header("Content-Type", "application/json;charset=utf-8");
next();
});
app.use(bodyParser.urlencoded({ //配置这两行代码
extended: true
}));
app.use(bodyParser.json()); //配置这两行代码
app.use('/', home);
app.use('/geocode', geocode);
app.listen(3001);4. Get the parameters passed by the front end in the background interface code, as follows:
var express = require('express');
var router = express.Router();
router.post('/forward', function(req, res) {
res.send({
state: 'success',
data: req.body.queryStr //获取前端传递的参数
});
});
module.exports = router;5. Access through ajax at the front end, as follows:
$.ajax({
url: 'http://localhost:3001/geocode/forward',
type: 'Post',
data: {
queryStr: '成都'
},
dataType: 'json',
success: function(result) {
console.log(result);
},
error: function(err) {
console.log('请求出错',err);
}
})6. Finally, you can see the results as follows:
to sum up
This article introduces how a POST-type background NodeJS interface receives parameters from the front end. For the GET-type background interface, we will discuss it later, because the blogger does not involve the GET-type background interface requirements for the time being.