Использование API, требующего авторизации в Angular
Я использую этот API, требующий авторизации. У меня есть токен и идентификатор клиента, поэтому я могу легко сделать запрос на завиток, но я пытаюсь заставить его работать в моем приложении angular. Команда curl:
curl -H "Authorization: $ACCESS_TOKEN" \
"https://chitchats.com/api/v1/clients/$CLIENT_ID/shipments"
Я пробовал сделать это в своем угловом приложении:
import { Component } from '@angular/core';
import { TestService } from './test.service';
import { HttpClient,HttpHeaders,HttpParams } from '@angular/common/http';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent {
response:any;
constructor(private http:HttpClient){
}
ngOnInit(){
}
searchProd(){
let headers=new HttpHeaders().set('Authorization','$ACESS_TOKEN')
this.http.get('https://chitchats.com/api/v1/clients/$CLIENT_ID/shipments', {headers})
.subscribe((response)=>{
this.response=response;
console.info(this.response);
})
}
}
Однако я получаю ошибку 403 при запуске приложения в браузере. У меня не было проблем с работой с другими API, не требующими авторизации.
Access-Control-Allow-Headers: * Access-Control-Allow-Methods: POST, GET, OPTIONS, PUT, DELETE Access-Control-Allow-Origin: * Allow: POST, GET, OPTIONS, PUT, DELETE
Может быть несколько вещей: 1. Нет доступа к ресурсу 2. CORS не настроен (используйте плагин Chrome, чтобы отключить клиентскую сторону CORS, чтобы проверить, так ли это: chrome.google.com/webstore/detail/allow-control-allow-origi/…)
Ответы 1
Не могли бы вы попробовать этот способ ...
let headers: HttpHeaders = new HttpHeaders();
headers = headers.append('Authorization', '$ACESS_TOKEN');
Если по-прежнему не работает, разрешите корс с задней стороны.
Если вы используете узел в качестве бэкэнда, поместите этот код в файл app.js.
// Allow cross origin permission
app.use(function (req, res, next) {
res.header("Access-Control-Allow-Origin", "*");
res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
next();
});
Привет, Трэвис, добро пожаловать в Stack Overflow. Какую информацию в заголовке ответа вы видите?
GET,OPTIONSи др.