Angular2 Http.get 发送两个请求

Question

我有简单的身份验证服务，我使用 jwt 令牌，如果我需要用户详细信息来检查授权 header 并发送请求 api 端点但 angular 2 请求发送第一个请求Header 空键但第二个正确 header 让我解释一下

错误Header http://pasteboard.co/c3wDdFxMy.jpg

正确Header 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
                    )
                );
            }
        }
}

第二个Header可以回显Token http://pasteboard.co/c3C6ed2k7.jpg

现在如果我构建产品项目发送一个请求，问题就只有开发模式了

Answer 1

看起来第一个请求是 OPTIONS 请求，因为 CORS。

如果是这样，那也没什么不妥。浏览器需要事先请求检查您是否可以调用 api 以及您想要的 Headers 是否被允许。

header Access-Control-Request-Headers 检查您是否可以在您的请求中发送 authorization header。

header Access-Control-Request-Method 检查您是否可以发送 GET 请求。

仅当客户端的域与 api 的域不同时才会发生预检请求。

看看这个link。

Angular2 Http.get 发送两个请求

Angular2 Http.get Send two request

php

angular

angular2-http