Angular2 bit.ly Ошибка заголовка «Access-Control-Allow-Origin»

Question

Я пытаюсь запустить bit.ly API, но я застрял в проблемах CORS. Я проверил все источники, которые мог, но проблема остается.

код Angular2:

getBitLyUrl (fullUrl : string): Observable<string> { 


    let headers = new Headers({'Access-Control-Allow-Origin' : '*', 'Accept' : 'application/json' }); 
    let options = new RequestOptions({ headers: headers }); 


    let res = this._http.get('https://api-ssl.bitly.com/v3/shorten?access_token=a4d0c60f2cfdba6941b9012c76d95a06f8b3765e&longUrl=' 
        + fullUrl + '&format=json', options) 
     .map((response: Response) => response.json()); 

    return res; 
} 

Заголовки из Chrome Сеть:

General: 
Request URL:https://api-ssl.bitly.com/v3/shorten?  access_token=a4d0c60f2cfdba6941b9012c76d95a06f8b3765e&longUrl=http://www.cyberma .net&format=json 
Request Method:OPTIONS 
Status Code:200 OK 
Remote Address:67.199.248.20:443 


Response: 
Allow:GET, POST, OPTIONS 
Connection:keep-alive 
Content-Length:0 
Content-Type:text/plain; charset=utf-8 
Date:Wed, 25 Jan 2017 10:22:31 GMT 
Server:nginx 

Request: 
Accept:*/* 
Accept-Encoding:gzip, deflate, sdch, br 
Accept-Language:en,cs;q=0.8,sk;q=0.6,de;q=0.4 
Access-Control-Request-Headers:access-control-allow-origin, x-xsrf-token 
Access-Control-Request-Method:GET 
Cache-Control:max-age=0 
Connection:keep-alive 
Host:api-ssl.bitly.com 
Origin:http://localhost:3000 
Referer:http://localhost:3000/ 
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/55.0.2883.87 Safari/537.36 

Я получаю эту ошибку:

XMLHttpRequest cannot load https://api-ssl.bitly.com/v3/shorten?access_token=a4d0c60f2cfdba6941b9012c76d95a06f8b3765e&longUrl=http://www.cyberma.net&format=json . Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin ' http://localhost:3000 ' is therefore not allowed access.

Любая помощь будет высоко ценится!

Answer 1

let headers = new Headers({'Access-Control-Allow-Origin' : '*', 'Accept' : 'application/json' });. Это заголовок ответа. CORS настроен на безопасный бэкэнд-сервер, поэтому эти заголовки должны быть настроены сервером backend в ответ. Если вы не контролируете сервер, нет доступа к нему из креста, если они не одобрят ваш домен.

OPTIONS запросы заданы браузером, а не угловым. Подробнее об этом here.

The Cross-Origin Resource Sharing standard works by adding new HTTP headers that allow servers to describe the set of origins that are permitted to read that information using a web browser. Additionally, for HTTP request methods that can cause side-effects on user data (in particular; for HTTP methods other than GET, or for POST usage with certain MIME types). The specification mandates that browsers "preflight" the request, soliciting supported methods from the server with an HTTP OPTIONS request header, and then, upon "approval" from the server, sending the actual request with the actual HTTP request method. Servers can also notify clients whether "credentials" (including Cookies and HTTP Authentication data) should be sent with requests.

Answer 2

Просто удалите заголовки и опционные аргументы функции ПОЛУЧИТЬ