Пытался получить данные из API api для запроса на получение http://swapi.co - PullRequest
0 голосов
/ 30 августа 2018

Я изо всех сил пытаюсь сделать успешный запрос на http://swapi.co.in из моего проекта localhost creat-Reaction-app. Я поместил свой запрос API выборки в мой componentDidMount основного константы.

fetchData = () => {
        return fetch('http://swapi.co/api/people', {method: 'GET'}).then((response) => {
            console.log(response);
        });
    }

    componentDidMount() {
        this.fetchData();
    }

дает мне ошибку

Failed to load http://swapi.co/api/people: Redirect from 'http://swapi.co/api/people' to 'https://swapi.co/api/people' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.


1 Uncaught (in promise) TypeError: Failed to fetch

После того, как я изменил свою функцию данных Fecth на

 fetchData = () => {
        return fetch('http://swapi.co/api/people', {
            method: 'GET',
            headers: {
                'Access-Control-Allow-Origin': '*',
            }

        }).then((response) => {

            console.log(response);
        });
    }

    componentDidMount() {
        this.fetchData();
    }

выдает ошибку

Failed to load http://swapi.co/api/people: Response for preflight is invalid (redirect)
:3000/#/:1 Uncaught (in promise) TypeError: Failed to fetch

Я попробовал несколько конфигураций с режимом: cors, Access-Control-Allow-Origin: origin, другие. Никто из них не работал для меня.

В чем может быть проблема?

1 Ответ

0 голосов
/ 30 августа 2018

Почему у вас проблемы с HTTP-запросом

Сервер отправляет следующие заголовки:

HTTP/1.1 301 Moved Permanently
Date: Thu, 30 Aug 2018 19:20:06 GMT
Transfer-Encoding: chunked
Connection: keep-alive
Cache-Control: max-age=3600
Expires: Thu, 30 Aug 2018 20:20:06 GMT
Location: https://swapi.co/api/people/
Server: cloudflare
CF-RAY: 45299ce127d321b6-EWR

Ни один из них не является заголовком CORS, и, поскольку запрос перенаправляет, он требует CORS.

Как исправить

Чтобы исправить это, вы можете изменить HTTP для HTTPS, чтобы избежать перенаправления.

Почему не добавляется заголовок самостоятельно

Поскольку заголовок используется для остановки запросов веб-сайтов, заголовок должен отправляться сервером. Если веб-сайт может отправить это, защита CORS ничего не добавит.

...