过去一周我一直在使用AngularJs2应用程序 . 这个应用程序有一个名为'CabBookingService'的服务,它进行http get()调用以从后端获取数据 . 后端基于REST,并使用Spring安全OAuth2实现进行身份验证 .
@Injectable()
export class CabBookingService {
private accessToken, bookingsUrl, bookings;
constructor(private _logger: Logger, private _http: Http) {
this.accessToken = localStorage.getItem('cabservice_access_token');
this.bookingsUrl = "http://52.3.51.119:8081/dynamo-server/dynamo/api/cabservice/bookings/list/submitted?access_token=" + this.accessToken;
}
getCabBookings() {
this._logger.log("Getting Cab Bookings ...accessToken, bookingsUrl = " + this.accessToken + "," + this.bookingsUrl);
return this._http.get(this.bookingsUrl)
.map(res => {
this._logger.log("response status = " + res.status);
return <CabBooking[]> res.json().cabBooking;
})
.catch(this.handleError);
}
private handleError(error: Response) {
console.error("Error occured in getting bookings...response: type, ok, url, status, headers: " + error.type + ", " + error.ok + ", " +
error.url + ", " + error.status + ", " + JSON.stringify(error.headers));
return Observable.throw(error.json().headers || 'Server error');
}
}
如代码所示,该服务使用存储在HTTP请求中的浏览器本地存储中的令牌 . 当令牌有效时,我获得了我在下面的Angular组件中处理的数据 .
this._cabBookingService.getCabBookings()
.subscribe(
bookings => {
this.bookings = bookings;
this._logger.log("Bookings => " + JSON.stringify(this.bookings));
},
err => {
this._logger.log("Error while accessing cab bookings...error, JSONed = " + err.status + "," + JSON.stringify(err));
},
() => console.log('Bookings Fetched!');
);
当令牌过期并且当我调用服务来获取数据时,服务器会抛出401错误 . 通过查看Chrome浏览器开发人员工具“网络”标签可以确认这一点 .
我遇到的问题是我无法捕获此401错误 . 当我在handleError()方法中记录错误时,我得到以下内容:
Error occured in getting bookings...response: type, ok, url, status, headers: 3, undefined, null, 200, "[]"
也就是说,日志显示200个HTTP代码而不是401.如果我需要做任何不同的事情,请告诉我 .
1 回答
检查网络日志中的HTTP方法 . 如果您正在编写HTML5应用程序,请在服务器中为CORS允许'option' . 例如,您可以将其添加到PHP服务器页面 .