代码之家 › 专栏 › 技术社区 › Maciejek

angular+asp core 2 http post数据始终为空

asp.net-core angular

0

Maciejek · 技术社区 · 7 年前

我在这个问题上挣扎了很长时间。

我有一个客户端应用程序集,其中包含Angular6和使用ASP Core2.1创建的WebAPI。

为了我的职位要求,我做了这样的事情。

const params = {
  TestData: newActions,
  ExportAndExecute: true
};

this.httpClient.post('/tests/export', params, {headers: {}}).subscribe((result) => {
  console.log(result);
});

其中httpclient.post方法为:

post(route: string, params: any, headers: object) {
return new Observable<any>(subscriber => {
  this.httpClient.post<any>(this.baseUrl + route, params, headers).subscribe((result) => {
    subscriber.next(result);
  }, (error: Response) => {
    this.handleRequestError(error);
  });
});

}

我的API控制器操作如下:

[HttpPost]
[Route("/api/[controller]/export")]
[Authorize(AuthenticationSchemes = "JwtBearer")]
public async Task<HttpStatusCode> ExportTest( [FromBody] ExportTestModel model)
{
    var result = HttpStatusCode.MisdirectedRequest; 
}

模型类是:

public class ExportTestModel
{
    public List<BsonDocument> TestData { get; set; }
    public bool ExportAndExecute { get; set; }
}

我不知道为什么每次从客户机发送数据时,控制器操作中都是空的。我试着把它作为一个字符串对象发送,在控制器中接收 object 或 JObject 但一切都不如预期。

如果我收到数据 工作项目 我看得很清楚,但我不想这样做。

我觉得自己很蠢,但也许有人能指点我的做法有什么不对。

2 回复 | 直到 7 年前

1

J.P. 7 年前

看了你的示例代码,我想到了两个选项:

错误的标题。因为您显式地将空的headers对象设置为第三个参数,这可能会导致angular无法为您要发送的内容类型(application/json)添加默认的http头。如果你不告诉asp.net core你发送的是什么类型的数据,那么asp.net core就不关心它,也不应用模型绑定。解决这个问题非常简单,只需删除 this.httpClient.post() 打电话。
```
this.httpClient.post('/tests/export', params).subscribe(result => {
  console.log(result);
});
```
您可以通过检查web开发人员工具栏中的网络流量来验证它是否设置了此头。
区分大小写。在javascript(以及json)中,驼峰大小写是标准的。你的 params 对象具有 TestData 和一个 ExportAndExecute ,都是帕斯卡的案子。可能是模型活页夹对大小写比较敏感。

2

0

wFitz 7 年前

这对我使用Angular6httpclient和ASP.NETCore2.0或2.1很有用

在控制器中:

const params = {
  TestData: newActions,
  ExportAndExecute: true
};

this.dataService.postData(params).subscribe( 
    data => {
       console.log('post OK !');
    },
    error => {
       console.log('post error !');
    }
);

为您服务:

  constructor( private http: HttpClient ) {}

  const headers = new HttpHeaders()
     .set('Content-Type', 'application/json')
     .set('Accept', 'application/json')

  const url = 'http://localhost:5000/api/'  

  postData( params ) {
     return this.http.post(
        url + 'grupos',
        JSON.stringify(params),
        { headers: headers }
     );        
  }