Axios не обрабатывает 500 из POST после того, как ОПЦИИ вернули 200 для CORS - PullRequest
0 голосов
/ 16 января 2019

Задача

Axios не обрабатывает 500, как ожидалось. Следовал способу обработки ошибок Axios , но он не работает.

POST отправляет имя пользователя / адрес электронной почты и пароль, но намеренно установлен неверный пароль для проверки обработки ошибок. Если установлен правильный пароль, работает без проблем.

    axios.post(
        config.apiGateway.URL + ".../signin",
        payload
    ).then(response => {
        console.log(response)
        if(response.status == 200){
            console.log("Login successfull");
            this.setState({token: response.data.JWT_TOKEN});
        } else {
            console.log(response.status)
            this.setError()
        }
    }).catch(error => {
        this.setError()
        console.log(error)
        if (error.response) {
            console.log("--------------------------------------------------")
            // The request was made and the server responded with a status code
            // that falls out of the range of 2xx
            console.log(error.response.data);
            console.log(error.response.status);
            console.log(error.response.headers);
        } else if (error.request) {
            console.log("*************************")

            // The request was made but no response was received
            // `error.request` is an instance of XMLHttpRequest in the browser and an instance of
            // http.ClientRequest in node.js
            console.log(error.request);
        } else {
            console.log("++++++++++++++++++++++++")
            // Something happened in setting up the request that triggered an Error
            console.log('Error', error.message);
        }
        console.log(error.config);
    })

Результат

Ожидается , если (error.response) часть выполнена, но на самом деле , если (error.request) выполняется.

Access to XMLHttpRequest at 'https://***-api.us-east-1.amazonaws.com/dev/***/signin' from origin 'http://localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
Login.js:73 Error: Network Error
    at createError (createError.js:17)
    at XMLHttpRequest.handleError (xhr.js:87)
Login.js:82 *************************
Login.js:87 XMLHttpRequest {onreadystatechange: ƒ, readyState: 4, timeout: 0, withCredentials: false, upload: XMLHttpRequestUpload, …}

В инструменте разработчика Chrome метод OPTIONS возвращает 200, как показано ниже.

access-control-allow-headers: Content-Type,X-Amz-Date,Authorization,X-Api-Key,X-Amz-Security-Token
access-control-allow-methods: GET,OPTIONS,POST,PUT
access-control-allow-origin: *
content-length: 0
content-type: application/json
date: Wed, 16 Jan 2019 01:32:48 GMT
status: 200
via: 1.1 ca8c566e53d4556421f22afbb9802d0c.cloudfront.net (CloudFront)
x-amz-apigw-id: Tkp2JEBmIAMFROA=
x-amz-cf-id: HXEEGh3TUcOckodVBKKoA1PVpg6h7UB5Ui3F1svTxpMYovB8Dt7rqQ==
x-amzn-requestid: a2144ccd-192e-11e9-9b6f-2dcad2a22d99

Метод POST возвращает 500, как и ожидалось.

Request Method: POST
Status Code: 500 
Remote Address: 54.230.245.164:443
Referrer Policy: no-referrer-when-downgrade

Окружающая среда

axios 0.18.0 с Google Chrome 70.0.3538.77 в Ubuntu 18 LTS.

Вопрос

Подскажите, пожалуйста, как правильно обращаться с 500.

Исследования

Как перехватить и обработать ответ 422 об ошибке с Redux / Axios? , кажется, имеет ту же проблему ошибки, установленную для трассировки стека, и ответ, кажется, не заполняется.

EDIT: Я все еще не понимаю, почему регистрация ошибки возвращает это сообщение стека. Я попытался войти, как это. И тогда вы действительно сможете увидеть, что это объект.

1 Ответ

0 голосов
/ 16 января 2019

Ваш вопрос просто ...

почему error.response нет?

Если это так, то причина в том, что ресурс, обрабатывающий ваш запрос POST, не отвечает заголовком Access-Control-Allow-Origin, даже если он отвечает на запрос перед полетом OPTIONS.

В соответствии с политикой CORS ваш код на стороне клиента поэтому запрещен доступ к ответу HTTP и, следовательно, error.response не определен.

В вашем обработчике ошибок вы можете предположить, что пустое свойство response соответствует проблеме сетевого уровня.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...