Angular2 Http.get發送兩個請求

Question

我有使用jwt令牌的簡單身份驗證服務，如果生病后需要用戶詳細信息檢查授權頭並發送請求api端點，但是角度2請求發送第一個請求頭空鍵，但是第二個正確的頭讓我解釋一下

網絡運營http://pasteboard.co/c3wmFZvtJ.jpg

標頭錯誤http://pasteboard.co/c3wDdFxMy.jpg

正確的標題http://pasteboard.co/1cKy9EHDy.jpg

我的Http.Get函數

getUsers(): Observable<User[]> {
    // Authorization Tokeni Ayarlanıyor
    let headers = new Headers({ 'Authorization': this.authenticationService.token });
    let options = new RequestOptions({ headers: headers });
    // Kullanıcı Headeri Gönderiliyor
    return this.http.get('http://localhost/Hesap/Detay', options)
        .map((response: Response) => 
            response.json().detay
     ); 
}

我在這里叫這個功能

ngOnInit() {
    this.userService.getUsers()
        .subscribe(users => {
            this.users = users;
        });
}

php側

public function Detay(){
    echo $this->headers["authorization"];
    if(!isset($this->headers["authorization"]) || empty($this->headers["authorization"])){
        echo json_encode(array("Hata" => "Header Yok"));
    }else{
        $token = explode(" ", $this->headers["authorization"]);
        $user = JWT::decode(trim($token[0],'"'));
        $this->load->model("auth_model");
        if($this->auth_model->checkUser($user->id, $user->KullaniciAdi) !== false)
            {
                $this->load->model("user_model");
                $detay = $this->user_model->get($user->id, $user->KullaniciAdi);
                echo json_encode(
                    array( 
                            "detay"=> $detay
                    )
                );
            }
        }
}

第二個標頭可以回顯令牌http://pasteboard.co/c3C6ed2k7.jpg

現在，如果我構建產品項目，則僅此問題開發模式發送一個請求

Answer 1

似乎第一個請求是由於CORS所需的OPTIONS請求。

如果是這樣的話，那沒有什么錯。 瀏覽器需要事先發出請求，以檢查是否可以調用api以及是否允許使用所需的標頭。

標頭Access-Control-Request-Headers檢查是否可以在請求中發送authorization標頭。

標頭Access-Control-Request-Method檢查您是否可以發送GET請求。

僅當客戶端的域與api的域不同時，才執行預檢請求。

看一下這個鏈接 。