Quan sát Angular2 cho chuyển hướng 302 khi tìm nạp tài nguyên

Question

Tôi có yêu cầu rút một số tài nguyên từ một tên miền khác do công ty của tôi giữ lại. Tôi muốn kéo nội dung HTML được bảo mật bằng các yêu cầu GET.

Khi người dùng đăng xuất khỏi ứng dụng, nội dung được yêu cầu sẽ trả lại 302 cho trang đăng nhập.

Nỗ lực của tôi để đánh hơi tiêu đề cho 302 không trả lại những gì tôi hy vọng cho đến nay. Phản hồi được trả về bởi Đài quan sát của tôi là 200 (trang đăng nhập).

Đây là ứng dụng mẫu của tôi.

export class MenuComponent implements OnInit { 

    private _resourceUrl = "http://localhost:3001/resources/menu"; 

    constructor(private _http: Http){ 
    } 

    menu: string; 

    ngOnInit(): void { 
     this.getMenu() 
      .subscribe(
       response => { 
        console.log(`Response status: ${response.status}`); 

        this.menu = response.text(); 
       }, 
       error => console.log(<any>error)); 
    } 

    getMenu(): Observable<Response>{   
     return this._http.get(this._resourceUrl) 
      .map((response: Response) => response) 
      .catch(this.handleError); 
    } 

    private handleError(error: Response){ 
     console.log(error); 
     return Observable.throw(error.json().error || 'Server Error'); 
    } 
} 

Tôi có đi đúng hướng không?

Answer 1

Nếu máy chủ gửi chuyển hướng có mã trạng thái 302 có URL chuyển hướng trong tiêu đề Location, chuyển hướng sẽ tự động được xử lý bởi trình duyệt, tức là yêu cầu URL này được thực thi.

Đó là lý do tại sao XHR (và trình bao bọc Angular2 xung quanh nó, tức là lớp Http) sẽ không nhìn thấy kết quả của yêu cầu đầu tiên mà chỉ thấy phản hồi của yêu cầu thứ hai.

Answer 2

Đây là mã làm việc của tôi để chuyển hướng đến ServiceData. Angular2 (4) và ASP net Core.

private post(url: string, data?: any) { 
    return this.http.post(url, data, { headers: this.headers }) 
     .map(response => this.extractData(response, true)); 
} 

private extractData(res: Response, mapJson = true) { 
    let body: any = res; 
    // redirect 
    if (body.url.search('ReturnUrl') != -1) { 
     let url = new URL(body.url); 

     // get patch redirect simple /account/login 
     let pathname = url.pathname; 

     // get params redirect simple ?ReturnUrl=%2Fapi%2Fitems%2FGetitems 
     let search = url.search; 

     // 1 navigate with params 
     this.router.navigate.navigate([pathname], { queryParams: { returnUrl: search } }); 

     // OR ... 

     // 2 navigate only pathname 
     this.router.navigate.navigate([pathname]); 
     return {}; 
    }    

    if (mapJson) { 
     body = body.json(); 
    } 
    return body || {}; 
}