使用 rxjs 可观察量未触发后回调

Question

我正在尝试调试来自发布调用的响应。帖子成功，回复会显示在 Chrome 开发者工具的回复标签页中，但 promise 回调永远不会触发。

知道为什么没有触发回调吗？

这是订阅：

this.mService.uploadFiles([file.name, new Blob()]).subscribe((response: any) => {
var myResponse = response;
//Do something with response
},
error => {
var err = `Failed with status = ${error.status}`;
});

调用 Rest API：

public uploadFiles(files: any): Observable<any> {
let formData = new FormData();
formData.append('file', files[1], files[0]);
return this.http.post(`${this.myServiceEndpoint + "api/uploadFiles"}`, formData, {
observe: 'response'
}).pipe(map(response => response))
}

即使开机自检成功，我实际上也收到以下错误。可能与服务的订阅方式有关。

core.js:4002 ERROR TypeError: You provided 'undefined' where a stream was expected. You can provide an Observable, Promise, Array, or Iterable.
at subscribeTo (subscribeTo.js:28)
at subscribeToResult (subscribeToResult.js:15)
at CatchSubscriber.error (catchError.js:43)
at XMLHttpRequest.onLoad (http.js:1707)
at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:423)
at Object.onInvokeTask (core.js:26247)
at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:422)
at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:195)
at ZoneTask.push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask [as invoke] (zone.js:498)
at invokeTask (zone.js:1693)

[更新]

下面是被调用的 Azure 函数的服务器端代码

[FunctionName("UploadFiles")]
public async Task<IActionResult> UploadFiles([HttpTrigger(AuthorizationLevel.Function, "post")]HttpRequest req, ILogger logger)
{
return (ActionResult)new OkObjectResult("Testing");
}

在这种情况下，Chrome 会在响应标签页中显示测试字符串。但是，不会触发回调。

。但如果将代码更改为仅返回 OkResult，则会触发回调。因此，似乎仅当 OkResult 包含有效负载时才会出现错误。任何线索为什么会失败？

return (ActionResult)new OkResult();

Answer 1

试一试 做 返回响应

public uploadFiles(files: any): Observable<any> {
let formData = new FormData();
formData.append('file', files[1], files[0]);
return this.http.post(`${this.myServiceEndpoint + "api/uploadFiles"}`, formData, {headers : new HttpHeaders({'Content-Type': 'application/x-www-form-urlencoded'})}).pipe(
map((response: Response) => {
return response;
})
)
}

每当您像这样在服务中映射时，请返回该值，以便映射值将返回您订阅此服务的位置

编辑

尝试传递标头，因为您要在 api 中传递文件对象

Answer 2

你可以这样尝试

元件

this.mService.uploadFiles([file.name, new Blob()]).subscribe((response: any) => {
var myResponse = response;
// here we are doing other operations like filtering and mapping etc..
myResponse.pipe(map(result => { console.log(result); }))
},
error => {
var err = `Failed with status = ${error.status}`;
});

服务

public uploadFiles(files: any): Observable<any> {
let formData = new FormData();
formData.append('file', files[1], files[0]);
return this.http.post(`${this.myServiceEndpoint + "api/uploadFiles"}`, formData, {
observe: 'response'
});
}

Answer 3

事实证明，我不得不在服务器端将响应转换为 json 格式(认为这是默认的 json(并转义字符串引号，因为 Angular 间隔器期待 json：

[FunctionName("UploadFiles")]
public async Task<IActionResult> UploadFiles([HttpTrigger(AuthorizationLevel.Function, "post")]HttpRequest req, ILogger logger)
{
var jsonResponse = JsonConvert.SerializeObject("Testing");
return (ActionResult)new OkObjectResult(jsonResponse);
}

并且回调触发成功。