Angular 4.x HTTP客戶端錯誤處理

我正在嘗試開發一款在前面使用Angular和後面使用Laravel 5.0的應用程序。Angular 4.x HTTP客戶端錯誤處理

在HTTP請求中，我很難得到錯誤。

這是我MenuController.php，讓我的菜單角爲JSON：

if($control){ 
     $response->data = Menu::get()->toArray(); 
    } 

    if(!$control) { 
     $response->error = 'Error!'; 
    } 

    return json_encode($response);

這是我menu.service.ts：

private menusUrl = '/api/menu'; 

constructor (private http: Http) {} 

getMenus(): Observable<Menu[]> { 
    return this.http.get(this.menusUrl) 
     .map(this.extractData) 
     .catch(this.handleError); 
} 

private extractData(res: Response) { 
    let body = res.json(); 

    return body.data || { }; 
} 

private handleError (error: Response | any) { 
    let errMsg: string; 

    if (error instanceof Response) { 
     const body = error.json() || ''; 
     const err = body.error || JSON.stringify(body); 
     errMsg = `${error.status} - ${error.statusText || ''} ${err}`; 
    } else { 
     errMsg = error.message ? error.message : error.toString(); 
    } 

    console.error(errMsg); 

    return Observable.throw(errMsg); 
}

這是menu-index.component.ts：

errorMessage: string; 
menus: Menu[]; 
mode = 'Observable'; 

constructor(private menusService: MenusService) { } 

ngOnInit() { this.getMenus(); } 

getMenus() { 
    this.menusService.getMenus() 
     .subscribe(
      menus => this.menus = menus, 
      error => this.errorMessage = <any>error); 
}

我從Laravel獲得菜單的部分工作正常，但無法獲取錯誤消息。

提示：我的Angular文件幾乎是Angular HTTP Client教程中提供的文件的精確副本。主要問題是我應該如何使用Laravel返回我的錯誤，以便Angular捕獲它們。

來源

2017-04-21 yenerunver

事實證明，我沒有返回正確的錯誤響應。這裏是MenuController.php的修正版本的相關部分：

if(!$control) { 
    $response['error'] = 'ERROR!'; 

    return (new Response($response, 400)) 
     ->header('Content-Type', 'application/json'); 
}

來源

2017-04-24 06:44:06 yenerunver

我看到了一些東西，你可以改善：

你並不需要手動序列化您的數據載體。 Laravel爲你處理。你所需要做的就是return $response。
你的句柄錯誤應該返回錯誤信息。鏈接承諾的工作方式是，調用next的回調接收前者的返回值。所以我認爲它應該足以返回return errMsg。

我不知道這些改進是否能解決您的問題，但它肯定是調試過程中的一步。

來源

2017-04-21 11:50:14 Leonard

親愛@Leonard，謝謝你的序列化尖。但是，您的第二個提示並未解決我的問題。 – yenerunver

Angular 4.x HTTP客戶端錯誤處理

回答

相關問題