Блог

Я создаю свое приложение в Angular 2 и Laravel 5.4. Angular2 предназначен для клиентской стороны, а laravel 5.4 — для серверной. Я создал API в laravel и запрашиваю эти API у Angular2.

В Laravel я настроил службу паспортов Oauth 2, которая проверяет подлинность всех API. В каждом вызове API я отправляю заголовки ниже.

‘Content-Type’, ‘Authorization’

То, как я вызываю API с заголовками.

 private headers = new Headers({'Content-Type': 'application/json', 'Authorization': 'Bearer '   localStorage.getItem('access_token') });


let body = JSON.stringify({ user_id, company_id });
            console.log(this.headers);
            this.http.post(this.BuyerCostSetting, body, {headers:this.headers} )
            .subscribe(
                response => {
                    console.log('here');
                    console.log(response);                  
                },
                error => {
                    console.log(error.text());
                }
            );
  

Когда я нажимаю на этот API из Angular2, он показывает следующую ошибку:

 Request header field Authorization is not allowed by Access-Control-Allow-Headers in preflight response
  

Сообщение об ошибке ясно, 'Authorization' заголовок не разрешен вашим серверным. В вашем серверном приложении Laravel вы должны установить заголовок ответа, содержащий:

 Access-Control-Allow-Headers : 'Content-Type', 'Authorization'
  

смотрите дополнительную документацию здесь: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Access-Control-Allow-Headers