我有一個 Angular 11.x 應用程式，它向后端系統執行 http 請求，該后端系統使用 FFMPEG 從視頻檔案（例如 mp4/mov）中讀取資料，因為處理需要 10 秒才能完成此異步請求。
為了更清晰，我對一些值進行了硬編碼
// 視頻組件.ts
let fileUrl = 'https://abc.s3.eu-west-2.amazonaws.com/video.mp4';
let fileSize = '56117299';
this.videoMetadata = this.videoService.getVideoMediaData(fileUrl, fileSize);
// if any errors found from the async response loop through them and push them into the following error which displays this on the frontend
/* I need to push the errors from the request above into this `errorMessages` variable
self.errorMessages['Instagram'].push({
"message": "Video must be between 3-60 seconds in duration",
});
*/
// video.service.ts（下載檔案并在端點使用FFMPEG獲取元資料）
public getMetadata(file: string, size: string): Observable<any> {
let params = new HttpParams();
params = params.append('file', file);
params = params.append('size', size);
return this.http.get('post/media-check', { params })
.pipe(map(response => {
return response;
}));
}
public getVideoMediaData(file, size) {
return new Promise((resolve, reject) => {
this.getMetadata(file, size).subscribe(
data => {
resolve(data);
},
errorResponse => {
}
);
});
}
將post/media-check在getMetadata功能擊中PHP端點并回傳類似于以下以下回應。
{
"status":"200",
"data":{
"video":{
"container":"mov",
"bitrate":338,
"stream":0,
"codec":"h264",
"fps":3
}
},
"errors":["Video must be at least 25 frames per second (fps)"],
"responseType":"json",
"response":"success"
}
如何從異步請求的后端回應中獲取錯誤陣列，直接推送到self.errorMessages變數中？
uj5u.com熱心網友回復：
首先，您需要確保video-service正確處理錯誤。
public getVideoMediaData(file, size) {
return new Promise((resolve, reject) => {
this.getMetadata(file, size).subscribe(
data => {
resolve(data);
},
errorResponse => {
// Reject the Promise and pass the error response in the rejection
reject(errorResponse);
}
);
});
}
然后video-component你可以像這樣處理這種情況：
let fileUrl = 'https://abc.s3.eu-west-2.amazonaws.com/video.mp4';
let fileSize = '56117299';
try {
this.videoMetadata = await this.videoService.getVideoMediaData(fileUrl, fileSize);
// happy path - do something with this.videoMetadata
} catch(e) {
// unhappy path - e = errorResponse
const messages = errorResponse.errors.map(message => ({ message }));
self.errorMessages['Instagram'].push(...messages);
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/369888.html
標籤：javascript json 有角的 打字稿 角11