@angular/cli项目构建--http(2)

客户端GET设置参数查询：

search() {
    const params = new HttpParams()
    .set('userName', this.userName)
    .set('fullName', this.fullName);
    this.http.get('/api/users', {params})
      .subscribe(data => {
        this.users = data['users'];
      });
  }

reset() {
    this.userName = '';
    this.fullName = '';
    this.search();
  }

node服务器响应：

app.get('/users', (req, res) => {
    if (_.isEmpty(req.query.userName)&&_.isEmpty(req.query.fullName)) {
        res.json({users: users});
    } else {
        res.json({
            users: users.filter(
                (user) =>
                ((user.userName).indexOf(req.query.userName)) > 0 ||
                ((user.fullName).indexOf(req.query.fullName)) > 0
            )
        });
    }
});

跨域设置：

app.all('*', function (req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "X-Requested-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();
});

 bodyParse use:

var express = require('express')  
var bodyParser = require('body-parser')  
var app = express()  
// parse application/x-www-form-urlencoded   
app.use(bodyParser.urlencoded({ extended: false }))//extended为false表示使用querystring来解析数据，这是URL-encoded解析器  
// parse application/json   
app.use(bodyParser.json())//添加json解析器  
app.use(function (req, res) {  
  res.setHeader('Content-Type', 'text/plain')  
  res.write('you posted:\n')  
  res.end(JSON.stringify(req.body, null, 2))  
}) 

var jsonParser = bodyParser.json()//获取JSON解析器中间件  
// create application/x-www-form-urlencoded parser   
var urlencodedParser = bodyParser.urlencoded({ extended: false })//url-encoded解析器  
// POST /login gets urlencoded bodies   
app.post('/login', urlencodedParser, function (req, res) {//注册URL解析器  
  if (!req.body) return res.sendStatus(400)  
  res.send('welcome, ' + req.body.username)  
})  
// POST /api/users gets JSON bodies   
app.post('/api/users', jsonParser, function (req, res) {//使用json中间件获取json数据  
  if (!req.body) return res.sendStatus(400)  
  // create user in req.body   
}) 

// parse various different custom JSON types as JSON   
app.use(bodyParser.json({ type: 'application/*+json' }))  
// parse some custom thing into a Buffer   
app.use(bodyParser.raw({ type: 'application/vnd.custom-type' }))  
// parse an HTML body into a string   
app.use(bodyParser.text({ type: 'text/html' }))  

 GET,POST,DELTE,PUT:

app.get('/users', function (req, res) {
    if (_.isEmpty(req.query.userName) && _.isEmpty(req.query.fullName)) {
        res.json({users: users});
    }
    else {
        res.json({
            users: users.filter(function (user) {
                return ((user.userName).indexOf(req.query.userName)) > 0 ||
                    ((user.fullName).indexOf(req.query.fullName)) > 0;
            })
        });
    }
});
app.post('/users', jsonParser, urlencodedParser, function (req, res) {
    var user = req.body.user;
    users.push(user);
    res.send('save success');
});

app.delete('/users/:id', function (req, res) {
    const deleteUser = users.findIndex(function (user) {
        return user.id === req.params.id;
    });
    users.splice(deleteUser, 1);
    res.send('delete success');
});

 

app.put('/api/tour/:id',function (req,res) {
    var id = req.params.id;
    var p = tours.some(function (p) {
       return p.id == id;
    });
    if(p){
       if(req.query.name) tours[id].name = req.query.name;
       if(req.query.price) tours[id].price = req.query.price;
       res.json({success:true,tours:tours,p:p});
    }else{
       res.json({error:'No such tour exists.'});
    }
});