Axios: "네트워크 오류"에 대한 코드/상태 설정

내 생각 엔 당신이 맞다. 상태 코드는 의미가 있습니다.

#204에서 누군가가 말했듯이 브라우저에서 네트워크 오류를 잡을 수 없는 경우가 있어서 Axios는 일반 오류( new Error('Network error') )로 응답합니다. 잘못된 응답(상태 코드 !== 2xx 또는 사용자 지정 검사)과 구별하려면 오류 메시지 대신 status 속성을 확인하는 것이 가장 좋은 방법이라고 생각합니다. 예:

axios.request(options).catch(function(error) {
  if (!error.status) {
    // network error
  }
});

사용자 지정 상태 코드를 설정하는 것은 좋지 않은 생각이고(더 많은 혼란을 일으킬 수 있음) 특정 속성을 설정하는 것은 단일 오류 사례만 있기 때문에 전혀 도움이 되지 않는다고 생각합니다.

물론 Node.js에서는 실제 오류에 액세스할 수 있고 Node.js 문서에 따라 확인할 수 있기 때문에 더 쉽습니다.

아, 그래서 Axios 호출에 의해 던져진 모든 오류는 1) 상태가 있거나 2) 일반적인 네트워크 오류로 보장됩니까? 충분히 좋은 것 같아요.

지금까지 404,500과 같은 오류 코드를 얻을 수 없습니다.. 여전히 네트워크 오류가 발생합니다. 이 문제를 해결하는 방법은 무엇입니까?
instance.post('/foo', {요청 ID : 12345})
.then(함수(응답) {})
.catch(함수(오류){
console.log(오류); // 네트워크 오류
console.log(error.status); // 찾으시는 주소가 없습니다
console.log(오류.코드); // 찾으시는 주소가 없습니다
});

네트워크 오류는 Axios가 서버에 전혀 연결할 수 없으므로 서버에서 오류 코드를 가져올 수 없음을 의미합니다. 다른 도구(curl, postman 또는 브라우저)를 사용하여 연결할 수 있는지 확인하시겠습니까?

내 서버에 연결할 수 있습니다. 실제로 404 오류 코드를 반환하고 일부 다른 API 호출과 함께 서버가 500 내부 서버 오류를 반환하지만 여전히 스크립팅을 통해 네트워크 오류 코드를 가져올 수 없습니다(즉, console.log( error.status); // 정의되지 않음).

error.response.status 있습니다.

이 문제가 발생했습니다. 아무도 나를 도와줄 수 있습니까?

서버 응답은 401이지만 axios는 다음을 제공합니다.

오류 --> "네트워크 오류"
error.response --> 정의되지 않음
error.status --> 정의되지 않음

오류가 "네트워크 오류"인 경우 Axios가 서버에 연결할 수 없거나 어떤 이유로 서버에서 응답을 받지 못함을 의미합니다. 따라서 401 오류는 Axios에 발생하지 않습니다. StackOverflow에 몇 가지 샘플 코드가 포함된 질문을 게시할 수 있습니까?

AWS API-Gateway를 사용할 때 이 문제가 발생했습니다. 동일한 문제를 보는 사람에게는 CORS 헤더로 응답하지 않는 4xx 오류(내 경우에는 401)가 있는 문제입니다. 이 빌어먹을 문제를 해결하는 데 몇 시간을 보냈습니다! 제 문제 해결 방법을 직접 알려주신 @jonathan-stone에게 감사드립니다.

@codygreen 나는 여전히 이 문제를 겪고 있으며 https://forums.aws.amazon.com/message.jspa?messageID=763752에 부딪쳤습니다.

해결 방법을 찾았습니까?

누구든지이 문제에 대한 해결책이 있습니까?

제 문제는 Jest+ Axios였습니다. 이것을 내 package.json에 추가하여 해결했습니다.

"jest": {
    "testEnvironment": "node"
}

이것은 작동하지만 지원하는 문서를 찾을 수 없는 것 같습니다. 나는 error.response가 네트워크 오류에서 비어 있어야 한다고 가정하고 있습니다. 그렇지 않으면 API 오류입니다.

axios.request(options).catch(function(error) {
  if (!error.response) {
    // network error
  } else {
    // http status code
    const code = error.response.status
    // response data
    const response = error.response.data
  }
});

누구든지 이것에 대한 최상의 솔루션을 찾았습니까? Axios 사람들은 약간의 소음을냅니다 :(

나는 또한 오늘이 오류가 발생했습니다. 문제가 무엇인지 모르겠습니다. 이것이 내 스크립트입니다.

js var url = "http://localhost:8000/"; Axios.get(url).then(function(response){ alert(response) }).catch(function(error){ alert(error) });

http://localhost :8000/ JSON 응답을 반환합니다. 다른 호스트에서는 작동하지 않습니다.

Cors 오류일 수 있습니다.

87행, xhr 어댑터에서 '네트워크 오류'로 설정되었습니까? 오류를 잡을 수 있도록 이것을 변경하는 방법은 무엇입니까?
https://github.com/axios/axios/blob/d7f021b8d4cc50bfa0653011bc02452d234d1255/lib/adapters/xhr.js#L84 -L91

문제는 아니지만 브라우저 보안으로 인해 예상되는 동작입니다. XHR 오류 응답은 이제 오류 상태 코드에 대해 ProgressEvent 를 수신합니다.

같은 문제가 있습니다. CORS의 문제라고 생각합니다. 누구든지 이에 대한 좋은 해결책을 찾았습니까?

@codygreen API Gateway 문제를 해결하셨습니까? 더 디버그하는 데 도움이 되는 응답 상태 코드를 파악할 수도 없습니다.

여기에 동일한 일반적인 문제가 있습니다. 저에게 그것은 확실히 CORS였습니다. 브라우저가 서버에 OPTIONS 요청을 하고 있었고 (노드에서) 이에 대한 핸들러 설정이 없었습니다. Axios는 (실패한) 요청을 성공적으로 완료하지만 정의되지 않은 응답으로

      return axios.httpClients.server.post('/someUrl, {
        someData:some_data
      }).then(response => {
        console.log(response);
        //the following errors out because response is undefined
        if (response.data && response.data.success === true) {
        }
      }).catch(err => {
           //catch never triggered
            console.log(err)
      });

응답의 응답 코드는 무엇입니까? 네트워크 오류인 경우 Fetch API 브라우저를 사용할 때 콘솔에 기록하지만 보안상의 이유로 JavaScript에 전달하지 않으므로 본문이 비어 있습니다. FETCH STANDERS를 참조하십시오. 응답의 네트워크 오류에 액세스하려면 HTTP 응답 코드를 200으로 변경하고 응답 본문에 오류 메시지를 포함하십시오.

내 문제는 DNS 문제였습니다. 우편 배달부에서는 작동했지만 axios에서는 실패했습니다. 컬이 거기에서도 실패하고 있다는 것을 알아내기 위해 컬을 시도했습니다. 그래서 내 DNS가 올바르게 구성되지 않았습니다. 이 문제가 발생하면 확인하십시오.

이것이 다른 경우에 적용 가능한지 확실하지 않지만 다음은 이 동일한 문제를 해결한 방법입니다(우리가 CORS를 말하는 것을 고려할 때).

프론트엔드 측에서 PUT 또는 POST 요청의 매개변수로 headers 를 전달하고 있는지 확인합니다.

const axiosParams = {
  headers: {
    'Content-Type': 'application/x-www-form-urlencoded',
    'Accept': 'application/json',
  },
};

axios.put(`${api.url}/like`, axiosParams)
  .then((response) => {
    // ...
  });

그리고 백엔드 측에서 Express와 함께 CORS를 사용하고 있는지 확인하십시오.

// server.js
const express = require('express');
const app = express();

var cors = require('cors'); // Yep, you need to install this
app.use(cors()); // Works 🎉

참조: 여기 와 여기 .

여러분, 저도 이 문제로 고민하다가 그만 두었습니다. 하지만 이제 Android 기기에서 내 axios post network createError 문제를 알아냈습니다. axios 네트워크 오류가 발생하는 이유는 axios에 전달한 양식 데이터에 잘못된 유형의 데이터 개체가 포함되어 있기 때문입니다. axios에서 허용하지 않는 양식 데이터 매개 변수 중 하나로 이미지 개체(Expo의 ImagePicker 개체)를 포함했습니다. Axios는 string, float, int 또는 image만 param으로 수신할 수 있습니다. image는 param으로 전달할 수 없으며 이미지 유형이 아니며 반응하는 기본 개체입니다. 제거하고 image.uri를 param 값에 할당하여 이미지 필드를 param으로 포함하면 작동합니다. 이전에 내가 직면했던 것과 같은 문제에 직면할 수 있는 사람들에게 이것이 도움이 되길 바랍니다.
axios 네트워크 오류를 테스트할 때 양식 데이터 중 일부를 하나씩 삭제하면 어느 것이 문제의 원인인지 알 수 있습니다.

~ @codygreen @hammadzz Amazon API Gateway에서 이에 대한 솔루션을 찾았습니까?~

업데이트: 누군가 API Gateway 및 CORS를 사용하여 이를 발견하면 응답에 access-control-allow-origin 응답 헤더를 추가해야 합니다.

#204에서 누군가가 말했듯이 브라우저에서 네트워크 오류를 잡을 수 없는 경우가 있어서 Axios는 일반 오류( new Error('Network error') )로 응답합니다. 잘못된 응답(상태 코드 !== 2xx 또는 사용자 지정 검사)과 구별하려면 오류 메시지 대신 status 속성을 확인하는 것이 가장 좋은 방법이라고 생각합니다. 예:

axios.request(options).catch(function(error) {
  if (!error.status) {
    // network error
  }
});

사용자 지정 상태 코드를 설정하는 것은 좋지 않은 생각이고(더 많은 혼란을 일으킬 수 있음) 특정 속성을 설정하는 것은 단일 오류 사례만 있기 때문에 전혀 도움이 되지 않는다고 생각합니다.

물론 Node.js에서는 실제 오류에 액세스할 수 있고 Node.js 문서에 따라 확인할 수 있기 때문에 더 쉽습니다.

Google에서 온 경우 이 API는 더 이상 사용되지 않습니다. 이것은 2016년, v <0.13입니다.

당신은 확인하려면 error.response 서버 응답, error.response === undefined 오프라인 상태의 특별한 경우에 error.code === 'ECONNABORTED' 시간 제한합니다.

업데이트: 누군가 API Gateway 및 CORS를 사용하여 이를 발견하면 응답에 응답 헤더를 추가해야 합니다.

access-control-allow-origin: *

확실히 이렇게 하지 마십시오. * 대신 원본을 적절하게 설정하십시오.

나에게 그것은 cors 문제였습니다. 만약 당신이 laravel을 사용하고 있고 당신이 정의한다면

 ->middleware(['auth:api'])

이 경로에 명시적으로 상속되지 않은 다른 모든 미들웨어를 추가해야 합니다.

->middleware(['auth:api','cors']);

나는 또한이 문제에 직면했습니다. localhost 대신 로컬 IP 주소를 사용하십시오(예: 10.0.0.12:8083 ). 그것은 나를 위해 일했습니다.

따라서 올바른 경우 axios 요청의 0 상태가 경우에 따라 나타나는 것 같습니다. 그러나 정확히 어떤 경우가 발생했는지 프로그래밍 방식으로 결정할 수는 없습니다.

이러한 경우에는 CORS 실행 전 요청 이 실패하여 실제 요청이 시도조차 되지 않는 경우가 포함됩니다. 이 때문에 404 상태는 적절하지 않습니다.

누군가 @joelnet 맥주를 사야 합니다. 이것은 내 하루를 구했습니다.

https://github.com/axios/axios/issues/383#issuecomment -308606088

다른 사람들은 다른 문제를 가질 수 있지만 저에게는 효과가 있었습니다.

간헐적으로 이 오류가 발생합니다. CORS 문제가 아닌 것 같습니다.
내 API/서버는 .net 서버입니다.
간헐적으로 이 문제에 직면한 다른 사람이 있습니까?

HTTP 또는 https를 지정하지 않았기 때문에 이 오류가 발생했습니다. 주로 코드 자체가 정의되지 않은 프로토콜에서 오류를 발생시킵니다. 이것은 처리되거나 오류 메타에서 포함되어야 합니다.

@jonathan-stone이 말했듯이 Axios는 단순히 무슨 일이 일어났는지 알지 못하기 때문에 이것이 고칠 수 있다고 생각하지 않습니다. 그것은 Funyuns를 위해 친구를 보내는 것과 같습니다. 그는 상점이 문을 닫았다고 말합니다. "항상 열려 있음"이라고 되어 있습니다. 왜 가게가 문을 닫았습니까? 그들은 영원히 문을 닫았습니까(404)? 아픈 사람이 있습니까(500)? 재고가 바닥났습니까(503)? 그는 몰라요, 그냥 닫혔어요(네트워크 오류)!

내 API에서 다양한 종류의 데이터를 검색하려고 시도하는 로컬 Express 서버에 대해 Axios를 연속적으로 빠르게 실행할 때 이 오류가 발생했습니다. Axios가 정확한 오류를 보고하지 않은 것은 아닙니다. 그렇지 않습니다. 제 Express 서버는 너무 바빠서 아무 응답도 하지 않았습니다.

요청을 재시도하면( #164 의 retry-axios 사용) AVAILABLE 서버에 문제가 있는 경우 데이터를 얻거나 실제 오류가 발생할 수 있습니다.

문제를 해결하려면 항상 지정해야 합니다.
엔진엑스

add_header '접근-제어-허용-원점' * 항상 ;

문제를 해결하려면 항상 지정해야 합니다.
엔진엑스

add_header '접근-제어-허용-원점' * 항상 ;

이러지 마. 절대 하지 마세요. 하나의 연결을 허용하기 위해 방화벽을 비활성화하지 않을 것입니다.

안녕하세요 여러분, 우리는 프록시에 엔티티 크기 보호를 설정했습니다. 일반 오류를 반환하지만 413 상태 코드를 가져올 수 없습니다... 어떻게든 가능한가요?

response 개체를 사용해 보셨습니까?
axios.get(url).then(stuff => console.log(Object.keys(stuff.response));

@ComputerCarl 성공 응답이 있다고 생각하십니까? catch 끝나므로 그렇게 생각하지 마십시오. 하지만 시도해 볼 수 있습니다 ...

죄송합니다! 내 머리는 다른 곳에 있었다! catch 개체 확인 ...catch(err => console.log(Object.keys(err.response));

악시오스 문서

내 프로그램 중 하나에 있습니다.
err.response.data.message;

내가 Express에서 보낸 것;

app.use(function (err, req, res, next) {
  res.status(err.status || 500);
  // this is err.response.data on Axios client
  res.send({ message: 'my custom error' });
});

@ComputerCarl하지만 error.response 동일, 정의되지 error.status 당신은 스크린 샷에서 볼 수 있습니다 :), 나는 그것을 가지고 console.log 이미. 보시다시피 error.request 만 XMLHttpRequest 객체입니다.

좋아.. 왜 두 개의 오류가 발생하는지 모르겠습니다(CORS와 함께 413). 그러나 Express를 사용하는 경우 CORS를 활성화해야 합니다.

const cors = require('cors');
// ...
app.use(cors());

또한 위에서 언급했듯이 서버가 귀하의 요청을 완전히 거부하면 Axios는 오류의 원인을 알지 못합니다. 이 시점에서 나는 당황했고 당신은 더 똑똑한 누군가가 대답할 때까지 기다려야 할 것입니다. :-)

@ComputerCarl 시도해 주셔서 감사합니다 :-D CORS는 괜찮습니다. 앱에서 동일한 API에 대한 다른 호출이 많이 있으며 제대로 작동합니다. API에서 반환된 오류도 쉽게 처리할 수 있습니다. 문제는 이것이 프록시 수준에서 취소되었다는 것입니다.

이것이 도움이 될지 모르겠지만 요청을 프록시하는 응용 프로그램을 만들었습니다. 내가 사용하고 있던 프레임워크가 Express 오류를 잡아먹고 있었습니다. 마지막으로 res.send({ message: messageFromProxy }); 오류를 명시적으로 전달한 후 클라이언트에서 오류를 보고 처리할 수 있었습니다.

행운을 빕니다.

@jonathan-stone은 "네트워크 오류는 Axios가 서버에 전혀 연결할 수 없음을 의미하므로 서버에서 오류 코드를 받을 수 없습니다.

이것은 누군가를 도울 수 있습니다.

error.data ;

당신은 내가 보낸 스크린 샷에서 볼 수 있듯이 @ balwant-SD 이곳은 , 브라우저는 정확하게 413 상태 코드를 인식하지만 Axios의하지 않습니다

네트워크 탭에서도 413 상태 코드를 볼 수 있습니다 ...

위에서 언급했듯이 401 오류를 반환하는 로그인 POST는 401 대신 정의되지 않은 코드와 함께 '네트워크 오류'만 반환합니다.

따라서 이 오류는 네트워크 탭에만 반영되는 잘못 구성된 CORS 오류인 것 같습니다. @ketysek 과 동일한 문제가 있으며 내 ngnix가 이에 대해 CORS를 적용하지 않는 것 같습니다. 이전에 언급했듯이 일반 네트워크 오류는 axios error.response 가 되지 않습니다. 여기서 저는 백엔드를 비난하고 싶습니다. 오 잠깐, 제가 그랬습니다...

안녕하세요, 저도 같은 문제가 있습니다. 적절한 응답 axios를 요청하는 경우에도 항상 "네트워크 오류"를 반환하고 .catch(function(error) {}); 평가. 이 문제에 대한 해결책이 있는 사람이 있습니까?

나는 오늘 같은 문제가 있었다. 이 문제는 주로 백엔드가 사이트 간 HTTP 요청을 허용하지 않는 것에 관한 것입니다. 제 경우에는 django를 사용하고 있으므로 corsheaders 클래스를 MIDDLEWARE에 가능한 한 높게 배치했습니다.
MIDDLEWARE = [ 'corsheaders.middleware.CorsMiddleware', //..etc ]
그리고 특정 출처만 허용하도록 CORS_ORIGIN_WHITELIST를 만들었습니다.
CORS_ORIGIN_WHITELIST = [ "http://localhost:8081" , //..etc ]
이것은 django-cors-headers용입니다. django 사용자가 아닌 경우 좋아하는 cors 헤더 모듈의 설명서를 확인해야 합니다.

#204에서 누군가가 말했듯이 브라우저에서 네트워크 오류를 잡을 수 없는 경우가 있어서 Axios는 일반 오류( new Error('Network error') )로 응답합니다. 잘못된 응답(상태 코드 !== 2xx 또는 사용자 지정 검사)과 구별하려면 오류 메시지 대신 status 속성을 확인하는 것이 가장 좋은 방법이라고 생각합니다. 예:

axios.request(options).catch(function(error) {
  if (!error.status) {
    // network error
  }
});

사용자 지정 상태 코드를 설정하는 것은 좋지 않은 생각이고(더 많은 혼란을 일으킬 수 있음) 특정 속성을 설정하는 것은 단일 오류 사례만 있기 때문에 전혀 도움이 되지 않는다고 생각합니다.

물론 Node.js에서는 실제 오류에 액세스할 수 있고 Node.js 문서에 따라 확인할 수 있기 때문에 더 쉽습니다.

이 접근 방식의 문제는 axios.then에서 일부 코드를 실행하고 코드에 "상수에 대한 할당"(저의 경우)과 같은 오류가 있다고 가정해 보겠습니다. 언급한 접근 방식을 사용하면 " 상수 할당"

코드 예:

axios(options).then(() => {
  const foo = '';
  foo = 'bar'; // will throw error "assignment to constant"
}).catch(error => {
  if (!error.status) {
    // "assignment to constant" will be considered as network error
  }
})

이 유틸리티 함수를 사용하여 호출 스택의 하위에서 네트워크 오류를 포착합니다(비-axios 오류를 네트워크 오류로 식별하는 것을 방지함).

function isNetworkError(err) {
  return !!err.isAxiosError && !err.response;
}

https://github.com/axios/axios/pull/1419 참조

이 유틸리티 함수를 사용하여 호출 스택의 하위에서 네트워크 오류를 포착합니다(비-axios 오류를 네트워크 오류로 식별하는 것을 방지함).

function isNetworkError(err) {
  return !!err.isAxiosError && !err.response;
}

#1419 참조

문제 해결
감사 해요

@mifi axios 가 아닌 오류를 네트워크 오류로 식별하는 것을 방지하기 위해 isNetworkError 를 사용하는 방법에 대한 더 자세한 예를 보여줄 수 있습니까?

다음과 같이

try {
  ...
  some code that calls axios
  ...
} catch (err) {
  if (isNetworkError(err)) return alert(‘check your connection);
  throw err;
}

CORS 오류이고 Serverless를 사용하는 경우 다음과 같이 수정할 수 있습니다.

resources:
  Resources:
    # CORS for 4xx errors
    GatewayResponseDefault4XX:
      Type: 'AWS::ApiGateway::GatewayResponse'
      Properties:
        ResponseParameters:
          gatewayresponse.header.Access-Control-Allow-Origin: "'*'"
          gatewayresponse.header.Access-Control-Allow-Headers: "'*'"
        ResponseType: DEFAULT_4XX
        RestApiId:
          Ref: 'ApiGatewayRestApi'

안녕하세요, 누군가 저를 도와줄 수 있습니까? '네트워크 오류':
https://stackoverflow.com/questions/58717673/axios-sending-network-error-while-status-is-200-ok

오류가 "네트워크 오류"인 경우 Axios가 서버에 연결할 수 없거나 어떤 이유로 서버에서 응답을 받지 못함을 의미합니다. 따라서 401 오류는 Axios에 발생하지 않습니다. StackOverflow에 몇 가지 샘플 코드가 포함된 질문을 게시할 수 있습니까?

또한 동일한 오류가 발생합니다. 저에게는 서버에 도달했으며 403 및 JSON으로 응답하여 Axios에서 Network Error 가 발생합니다.

브라우저 네트워크 탭에서 응답을 볼 수 있지만 catch 블록에서 err.response 가 정의되지 않았습니다.

@narenderv7 나도

@WarisR 서버 측에서

서버에 추가 'Access-Control-Allow-Origin': '*'

@ketysek 같은 오류가 발생했습니다.

이 오류를 잡을 방법을 찾았습니까?

안녕하세요 여러분, 상태 403(4 * & 5 )으로 응답을 받고 있는 CORS 오류에 문제가 있습니다.Nginx 전송 헤더 "Access-Control-Allow-Origin"은 응답 상태 2 및 3에 *.

이 문제를 해결합니다. 다음에서 nginx 구성을 편집합니다.
add_header 'Access-Control-Allow-Origin' '*';
에게:
add_header 'Access-Control-Allow-Origin' '*' always;

axios 0.18.0 및 0.19.0을 사용하여 테스트하는 것과 동일한 문제가 있습니다.

단계:
나는 만료된 토큰으로 요청을 했고 때때로 error.response가 올바르게 왔지만 때로는 오류 응답이 정의되지 않고 메시지가 '네트워크 오류'입니다. 백엔드 오류 또는 axios의 버그가 발생하는 이유는 무엇입니까?

때로는 브라우저의 AD 차단기로 인해 발생할 수 있습니다 ...
incognito 또는 private 모드를 시도하거나 새 브라우저를 다운로드하여 테스트하십시오...

@narenderv7 네, 서버측 실수입니다. 하지만 Axios는 이 경우의 오류를 처리할 수 있어야 한다고 생각합니다.

이 두 가지 경우를 구별해야 합니다.

• POST https://xxx.com/sendMessage net::ERR_NAME_NOT_RESOLVED
• POST https://xxx.com/sendMessage net::ERR_INTERNET_DISCONNECTED

내가 확인한 대로. catch 블록에 의한 오류 반환은 위의 두 경우 모두 동일합니다.

여전히 문제가 있습니다.
https://github.com/axios/axios/issues/1296

오류가 여전히 존재합니다. 이 문제에 대한 해결책이 있는 사람이 있으면 공유해 주십시오.

이 유틸리티 함수를 사용하여 호출 스택의 하위에서 네트워크 오류를 포착합니다(비-axios 오류를 네트워크 오류로 식별하는 것을 방지함).

function isNetworkError(err) {
  return !!err.isAxiosError && !err.response;
}

#1419 참조

시간 초과 오류는 이러한 조건과도 일치할 수 있습니다.