angular2 中的地图问题
map issue in angular2
我正在用 angular2 创建高级登录系统。现在我面临拦截器问题。我已经在 angular2 中为 api 通信创建了网关。这是我的代码
gateWay(Method, Url, data) {
console.log("gateWay "+Method)
this.Method = Method
this.Url = Url
this.data = data
if(Method == "get"){
return this.http.get('http://localhost:3000/' + Url, { headers: this.insertAuthToken }).map((res) => res.json())
.map((res) => res.json())
}else if(Method == "post"){
return this.http.post('http://localhost:3000/' + Url, JSON.stringify(data), { headers: this.insertAuthToken })
.map((res) => res.json());
}else if(Method == "put"){
return this.http.put('http://localhost:3000/' + Url, JSON.stringify(data), { headers: this.insertAuthToken })
.map((res) => res.json());
}else if(Method == "delete"){
return this.http.delete('http://localhost:3000/' + Url, { headers: this.insertAuthToken })
.map((res) => res.json());
}
}
如果状态 200 意味着我能够在 console.log 中看到响应消息的状态代码。但是如果我得到 403 的响应意味着我需要在这种情况下处理某些功能我面临的问题我无法处理这些功能因为我确实在我的组件中订阅错误
this.httpService.gateWay('get', 'v1/users/index', undefined)
.subscribe(
data => console.log(data),
error => console.log(error),
() => console.log("finished")
)
所以如果我得到 403,请给我一些触发功能的想法,否则 400 意味着需要在警报中显示消息。这是我的令牌设置,在这里我使用 set Interval
重置令牌
SetTokenDynamically(time) {
console.log("time " + time)
clearInterval(this.timer)
this.timer = setInterval(() => {
// this.http.get('https://jsonblob.com/api/jsonBlob/56d80451e4b01190df528171')
this.http.get('http://localhost:3000/v1/users/tokenUpdate', { headers: this.headerRefreshToken })
.map((res) => res.json())
.subscribe(
data => {
Cookie.setCookie('Token2', data.token + this.a)
console.log("Call " + this.a)
this.response = data;
},
error => console.log(error),
() => {
console.log(this.response)
this.insertAuthToken = new Headers({
'AuthToken': this.response.token || ""
})
Cookie.setCookie('Authorization', this.response.token)
this.SetTokenDynamically(this.response.time_expiry_sec)
}
);
}, time);
}
这是因为在 403 状态码的情况下,不会执行 map
回调,而是执行 catch
回调(如果不是,则订阅时指定的错误回调)。
this.http.get('http://localhost:3000/' + Url, {
headers: this.insertAuthToken
})
.map((res) => res.json())
.catch((res) => { // <------
if(res.status == 403){
this.SetTokenDynamically(100);
}
});
我猜想如果您收到 403 错误并再次执行请求,您会尝试动态添加令牌。
这是一个示例:
@Injectable()
export class CustomHttp extends Http {
constructor(backend: ConnectionBackend, defaultOptions: RequestOptions) {
super(backend, defaultOptions);
}
request(url: string | Request, options?: RequestOptionsArgs): Observable<Response> {
(...)
}
get(url: string, options?: RequestOptionsArgs): Observable<Response> {
console.log('get...');
return super.get(url, options).catch(res => {
if (res.status === 403) {
// Set token in options
return super.get(url, options);
} else {
Observable.throw(res);
}
});
}
(...)
}
如果您需要发出请求以获取授权令牌,您需要利用 flatMap
运算符:
get(url: string, options?: RequestOptionsArgs): Observable<Response> {
return super.get(url, options).catch(res => {
if (res.status === 403) {
return this.getToken().flatMap(token => {
// Set token in options
this.setToken(options);
// Execute again the request
return super.get(url, options);
}
} else {
Observable.throw(res);
}
});
我正在用 angular2 创建高级登录系统。现在我面临拦截器问题。我已经在 angular2 中为 api 通信创建了网关。这是我的代码
gateWay(Method, Url, data) {
console.log("gateWay "+Method)
this.Method = Method
this.Url = Url
this.data = data
if(Method == "get"){
return this.http.get('http://localhost:3000/' + Url, { headers: this.insertAuthToken }).map((res) => res.json())
.map((res) => res.json())
}else if(Method == "post"){
return this.http.post('http://localhost:3000/' + Url, JSON.stringify(data), { headers: this.insertAuthToken })
.map((res) => res.json());
}else if(Method == "put"){
return this.http.put('http://localhost:3000/' + Url, JSON.stringify(data), { headers: this.insertAuthToken })
.map((res) => res.json());
}else if(Method == "delete"){
return this.http.delete('http://localhost:3000/' + Url, { headers: this.insertAuthToken })
.map((res) => res.json());
}
} 如果状态 200 意味着我能够在 console.log 中看到响应消息的状态代码。但是如果我得到 403 的响应意味着我需要在这种情况下处理某些功能我面临的问题我无法处理这些功能因为我确实在我的组件中订阅错误
this.httpService.gateWay('get', 'v1/users/index', undefined)
.subscribe(
data => console.log(data),
error => console.log(error),
() => console.log("finished")
)
所以如果我得到 403,请给我一些触发功能的想法,否则 400 意味着需要在警报中显示消息。这是我的令牌设置,在这里我使用 set Interval
重置令牌SetTokenDynamically(time) {
console.log("time " + time)
clearInterval(this.timer)
this.timer = setInterval(() => {
// this.http.get('https://jsonblob.com/api/jsonBlob/56d80451e4b01190df528171')
this.http.get('http://localhost:3000/v1/users/tokenUpdate', { headers: this.headerRefreshToken })
.map((res) => res.json())
.subscribe(
data => {
Cookie.setCookie('Token2', data.token + this.a)
console.log("Call " + this.a)
this.response = data;
},
error => console.log(error),
() => {
console.log(this.response)
this.insertAuthToken = new Headers({
'AuthToken': this.response.token || ""
})
Cookie.setCookie('Authorization', this.response.token)
this.SetTokenDynamically(this.response.time_expiry_sec)
}
);
}, time);
}
这是因为在 403 状态码的情况下,不会执行 map
回调,而是执行 catch
回调(如果不是,则订阅时指定的错误回调)。
this.http.get('http://localhost:3000/' + Url, {
headers: this.insertAuthToken
})
.map((res) => res.json())
.catch((res) => { // <------
if(res.status == 403){
this.SetTokenDynamically(100);
}
});
我猜想如果您收到 403 错误并再次执行请求,您会尝试动态添加令牌。
这是一个示例:
@Injectable()
export class CustomHttp extends Http {
constructor(backend: ConnectionBackend, defaultOptions: RequestOptions) {
super(backend, defaultOptions);
}
request(url: string | Request, options?: RequestOptionsArgs): Observable<Response> {
(...)
}
get(url: string, options?: RequestOptionsArgs): Observable<Response> {
console.log('get...');
return super.get(url, options).catch(res => {
if (res.status === 403) {
// Set token in options
return super.get(url, options);
} else {
Observable.throw(res);
}
});
}
(...)
}
如果您需要发出请求以获取授权令牌,您需要利用 flatMap
运算符:
get(url: string, options?: RequestOptionsArgs): Observable<Response> {
return super.get(url, options).catch(res => {
if (res.status === 403) {
return this.getToken().flatMap(token => {
// Set token in options
this.setToken(options);
// Execute again the request
return super.get(url, options);
}
} else {
Observable.throw(res);
}
});