如何从angular向node.js发送数据

Question

我需要将一些数据从 Angular 传递到 Node.js 服务器。这是我的角度帖子列表组件：从“@angular/核心”导入 { 组件，OnInit };从 “@angular/common/http” 导入 { HttpClient };

@Component({
  selector: 'app-postlist',
  templateUrl: './postlist.component.html',
  styleUrls: ['./postlist.component.css']
})
export class PostlistComponent implements OnInit {

  constructor(private http: HttpClient) { }
  public data="test";
  ngOnInit(): void {
      this.http
        .post("http://localhost:3000/api/book",this.data);  
  }

}

我的node.js服务器:

const express=require('express');
var app = express();
app.post('/api/book', function(req, res, next){
    var data = req.body.params;
    console.log(data);
 });
 app.listen(3000);

我想安慰一下。记录数据，但什么都没有发生。

Answer 1

在服务器中，您必须将消息的格式更改为JSON，如下所示

app.get('/api/GetFlux',function(req,resp){
  let data = "hello"
  resp.send(JSON.stringify(data));
})

在角度水平上

GetFlux():Observable<any[]>{
  return this.http.get<any>(this.APIUrlNode+'/GetFlux');
}




      this.service.GetFlux().subscribe(res =>{
        this.fluxList = {
          data:res
        } 
        console.log("Data from node "+this.fluxList.data)
             //,
      }, err => {
        console.log(" err = "+err)
      })

Answer 2

如果您计划打印有效载荷＜code＞，请执行此操作。数据，接受请求。body而不是req.body.params。此外，还要检查控制台中是否存在cors错误，这也可能会阻止您的数据到达web服务器。

Answer 3

您的通话中缺少 .subscribe。将您的代码更改为：-

  ngOnInit(): void {
      this.http
        .post("http://localhost:3000/api/book",this.data).subscribe();  
  }

在 nodejs 中，只需打印 req.body