Axios: 「ネットワークエラー」のコード/ステータスを設定します

私はあなたが正しいと思います。 ステータスコードは理にかなっています。

＃204で誰かが言ったように、ブラウザでネットワークエラーをキャッチできない場合があるため、Axiosは一般的なエラー（ new Error('Network error') ）で応答します。 それらを悪い応答（ステータスコード！== 2xxまたはカスタムチェック）と区別したい場合は、エラーメッセージの代わりにstatusプロパティをチェックするのが最善の方法だと思います。 例えば：

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

カスタムステータスコードを設定することは悪い考えであり（混乱を招く可能性があります）、特定のプロパティを設定しても、エラーケースが1つしかないため、まったく役に立ちません。

もちろん、実際のエラーにアクセスでき、Node.jsのドキュメントに従って確認できるため、Node.jsの方が簡単です。

ああ、Axios呼び出しによってスローされたエラーは、1）ステータスがあるか、2）一般的なネットワークエラーであることが保証されていますか？ それで十分だと思います。

これまでのところ、404,500 ..のようなエラーコードを取得できません。それでも、ネットワークエラーが発生します。 これを解決する方法は？
instance.post（ '/ foo'、{request_id：12345}）
.then（function（response）{}）
.catch（function（error）{
console.log（エラー）; // ネットワークエラー
console.log（error.status）; // 未定義
console.log（error.code）; // 未定義
}）;

ネットワークエラーは、Axiosがサーバーにまったく接続できなかったため、サーバーからエラーコードを取得できないことを意味します。 たぶん、別のツール（curl、postman、またはブラウザー）で試して、接続できることを確認しますか？

サーバーに接続できます。実際には404エラーコードが返され、他のAPI呼び出しではサーバーは500内部サーバーエラーを返しますが、それでもスクリプト（ie、console.log（ error.status）; //未定義）。

error.response.statusます。

この問題が発生しています。 誰か助けてくれませんか？

サーバーの応答は401ですが、axiosはこれを提供します。

エラー->「ネットワークエラー」
error.response->未定義
error.status->未定義

エラーが「ネットワークエラー」の場合、Axiosがサーバーに接続できないか、何らかの理由でサーバーから応答が得られないことを意味します。 そのため、401エラーがAxiosに組み込まれることはありません。 たぶん、StackOverflowにいくつかのサンプルコードで質問を投稿しますか？

AWS API-Gatewayを使用しているときに、これに遭遇しました。 同じ問題が発生している場合は、4xxエラー（私の場合は401）がCORSヘッダーで応答しないという問題です。 このいまいましい問題のトラブルシューティングに何時間も費やしました！ トラブルシューティングを正しい方向に向けてくれた@ 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
  }
});

誰かがこれについての最良の解決策を見つけましたか？ アクシオスの人々はいくつかの音を立てます:(

今日もこのエラーが発生しました。問題が何であるかわかりません。これが私のスクリプトです。

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の問題でした。 それは郵便配達員で働いたが、アクシオスでは失敗した。 カールを試して、そこでも失敗していることを確認しました。 そのため、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 networkcreateErrorの問題を理解しました。 axiosネットワークエラーの理由は、axiosに渡したフォームデータに間違ったタイプのデータオブジェクトが含まれているためだと思います。 axiosでは受け入れられないフォームデータのパラメータの1つとして画像オブジェクト（ExpoのImagePickerオブジェクト）を含めました。 Axiosは、文字列、float、int、またはimageのみをパラメーターとして受け取る場合があります。 imageはparamとして渡すことができません、それはimageのタイプではありません、それは反応ネイティブオブジェクトです、私はそれを削除し、image.uriをparamの値に割り当てることによってparamとして画像フィールドを含めますそしてそれは機能します。 これが私が以前直面していたのと同じ問題に遭遇するかもしれない何人かの人々を助けることを願っています。
axiosネットワークエラーをテストしているときにフォームデータの一部を1つずつ削除すると、問題の原因がどれであるかがわかります。

〜 @ 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
  }
});

カスタムステータスコードを設定することは悪い考えであり（混乱を招く可能性があります）、特定のプロパティを設定しても、エラーケースが1つしかないため、まったく役に立ちません。

もちろん、実際のエラーにアクセスでき、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: *

絶対にこれをしないでください。 *代わりに、それに応じて原点を設定します。

私にとっては、laravelを使用していて、

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

このルートに必要な他のすべてのミドルウェアを、継承されていない明示的に追加する必要があります

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

私もこの問題に直面しました。ローカルホストの代わりにローカル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を使用して）リクエストを

問題を解決するには、常に指定する必要があります
Nginx

add_header'Access-Control-Allow-Origin '*常に;

問題を解決するには、常に指定する必要があります
Nginx

add_header'Access-Control-Allow-Origin '*常に;

これをしないでください。 これは絶対にし

こんにちは皆さん、プロキシにエンティティサイズ保護を設定しました。一般的なエラーが返されますが、413ステータスコードを取得できません...どういうわけか可能ですか？

responseオブジェクトを試しましたか？
axios.get(url).then(stuff => console.log(Object.keys(stuff.response));

@ComputerCarl成功したと思いますか？ catchで終わるのでそうは思わないでください、しかし私はそれを試すことができます...

ごめん！ 私の頭は他の場所にありました！ キャッチオブジェクト...catch(err => console.log(Object.keys(err.response));確認してください

Axiosドキュメント

私は自分のプログラムの1つに参加しています。
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オブジェクトです。

わかりました。なぜ2つのエラー（CORSに加えて413）が発生するのかわかりません。 ただし、Expressを使用している場合は、CORSを有効にする必要があります。

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

また、前述したように、サーバーのフラットアウトが要求を拒否した場合、Axiosはエラーの原因を認識しません。 この時点で、私は困惑していて、賢い人が答えるのを待つ必要があります。 :-)

@ComputerCarlお試しいただきありがとう

これがあなたに役立つかどうかはわかりませんが、リクエストをプロキシするアプリケーションを作成しました。 私が使用していたフレームワークは、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 = [ '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
  }
});

カスタムステータスコードを設定することは悪い考えであり（混乱を招く可能性があります）、特定のプロパティを設定しても、エラーケースが1つしかないため、まったく役に立ちません。

もちろん、実際のエラーにアクセスでき、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
  }
})

このユーティリティ関数を使用して、コールスタックの下位からネットワークエラーをキャッチします（非軸エラーをネットワークエラーとして識別しないようにします）。

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

https://github.com/axios/axios/pull/1419を参照して

このユーティリティ関数を使用して、コールスタックの下位からネットワークエラーをキャッチします（非軸エラーをネットワークエラーとして識別しないようにします）。

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

＃1419を参照

問題を解決しました
ありがとう

@mifiは、 isNetworkErrorを使用して、非軸エラーをネットワークエラーとして識別しないようにする方法のより詳細な例を示すことができますか？

ちょうどこのような：

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

これがCORSエラーであり、サーバーレスを使用している場合、これで修正できます。

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は、応答ステータス2および3 *

私はこの問題を解決します：nginxconfigを編集します：
add_header 'Access-Control-Allow-Origin' '*';
に：
add_header 'Access-Control-Allow-Origin' '*' always;

同じ問題があります。axios0.18.0と0.19.0を使用してテストしています。

手順：
期限切れのトークンを使用してリクエストしたところ、error.responseが正しく表示されることがありましたが、エラー応答が未定義で、メッセージが「ネットワークエラー」である場合があります。 これがバックエンドエラーまたはaxiosのバグであるのはなぜですか？

ブラウザのADブロッカーが原因である場合があります...
incognitoまたはprivateモードを試すか、新しいブラウザをダウンロードしてテストしてください...

@ narenderv7はい、サーバー側の間違いです。 しかし、Axiosはこのケースのエラーを処理できるはずだと思いますよね？

私はこれらの2つのケースを区別する必要があります：

• 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

エラーはまだ存在します。誰かがこの問題の解決策を持っている場合は、私たちと共有してください。

このユーティリティ関数を使用して、コールスタックの下位からネットワークエラーをキャッチします（非軸エラーをネットワークエラーとして識別しないようにします）。

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

＃1419を参照

タイムアウトエラーもこれらの条件に一致する可能性があります。