jQuery.ajaxから応答ステータスコードを取得する方法

230

次のコードでは、jQuery.ajax呼び出しからHTTP応答コードを取得するだけです。次に、コードが301（永久に移動）の場合、 'Location'応答ヘッダーを表示します。

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
  <title>jQuery 301 Trial</title>
  <script src="http://code.jquery.com/jquery-1.5.1.min.js"></script>

  <script type="text/javascript">
  function get_resp_status(url) {
    $.ajax({
      url: url,
      complete: function (jqxhr, txt_status) {
        console.log ("Complete: [ " + txt_status + " ] " + jqxhr);
        // if (response code is 301) {
        console.log ("Location: " + jqxhr.getResponseHeader("Location"));
        // }
      }
    });
  }
  </script>
  <script type="text/javascript">
  $(document).ready(function(){
    $('a').mouseenter(
      function () {
        get_resp_status(this.href);
      },
      function () {
      }
    );
  });
  </script>
</head>
<body>
  <a href="http://ow.ly/4etPl">Test 301 redirect</a>
  <a href="http://cnn.com/not_found">Test 404 not found</a>
</body>
</html>

誰かが私が間違っているところを指摘できますか？Firebugで「jqxhr」オブジェクトを確認すると、ステータスコードも「Location」応答ヘッダーも見つかりません。「complete」の最後の行にブレークポイントを設定しました。

どうもありがとう。

ajax jquery-1.5

— マヘシュ
ソース

1

api.jquery.com/jQuery.ajax

— ehsan

私はこれが古いことを知っていますが、私はそれを解決したと思います（XHR.responseURL）：stackoverflow.com/a/39416846/4946681

— Nate

221

jqXhrオブジェクトのステータスフィールドが表示されます。次のフィドルが機能しています。

http://jsfiddle.net/magicaj/55HQq/3/

$.ajax({
    //...        
    success: function(data, textStatus, xhr) {
        console.log(xhr.status);
    },
    complete: function(xhr, textStatus) {
        console.log(xhr.status);
    } 
});

— アダム・エアーズ
ソース

2

jsFiddleで動作しているようです。それとjQueryのドキュメントに基づいて、xhr.statusは私がやりたいことをするはずです。ただし、元のコード（txt_statusをjqxhr.statusに置き換えたもの）で同じことを試みると、jqxhr.statusが0になります。スクリーンショットは次のとおり

— Mahesh

10

問題は、あなたがWebサーバーに対してではなく、ファイルシステムからローカルに実行していることだと思います。ローカルWebサーバーを起動した場合、これは正常に機能すると思います。このトピックに関するいくつかの記事を次に示します。pearweb.com / javascript / XMLHttpRequest.html developer.mozilla.org/En/Using_XMLHttpRequest「ここで重要なのは、結果のステータスは、200ではなく0と比較されます。これは、ファイルおよびFTPスキームがHTTP結果コードを使用しないためです。」

— Adam Ayres

これは素晴らしい。特に、バックエンドにステータスコードを送信させることができる場合。

— thatmiddleway '10

応答が302のようなリダイレクトステータスの場合、200

— Accountantم

52

私が同じような解決策を探しているこの古いスレッドに出くわし、受け入れられた答えがの.complete()方法を使用していることがわかりましたjquery ajax。私はここjqueryのウェブサイトで通知を引用します：

jqXHR.success（）、jqXHR.error（）、及びjqXHR.complete（）がコールバックされている非推奨のjQuery 1.8のように。最終的な削除のためにコードを準備するには、代わりにjqXHR.done（）、jqXHR.fail（）、およびjqXHR.always（）を使用します。

status codeajax応答を知るには、次のコードを使用できます。

$.ajax( url [, settings ] )
.always(function (jqXHR) {
    console.log(jqXHR.status);
});

と同様に動作.done()します.fail()

— 面
ソース

2

これは、「未定義」戻っている

— ペドロ・ホアキン・

43

$ .ajax関数に渡されたパラメーターオブジェクトのstatusCodeプロパティを使用するほうが、おそらくより慣用的なjQueryです。

$.ajax({
  statusCode: {
    500: function(xhr) {
      if(window.console) console.log(xhr.responseText);
    }
  }
});

ただし、リビングストンサミュエルが言ったように、JavaScriptで301ステータスコードをキャッチすることはできません。

— rstackhouse
ソース

41

XHRリクエストがリダイレクト応答（HTTPステータス301、302、303、307）XMLHttpRequest を返すと、は自動的にリダイレクトされたURLをたどり、そのURLのステータスコードを返します。

statusxhrオブジェクトのプロパティを介して、リダイレクトしないステータスコード（200、400、500など）を取得できます。

だから、のレスポンスヘッダからリダイレクトされた場所を得ることができない301、302、303または307要求。

ブラウザーに任せるのではなく、リダイレクトを処理できる方法で応答するようにサーバーロジックを変更する必要がある場合があります。実装例。

— リビングストンサミュエル
ソース

24

responeのコンテンツを確認するには、console.logを実行するだけで、whitchプロパティにステータスコードがあることがわかります。jsonが理解できない場合は、ビデオを参照してください：https : //www.youtube.com/watch?v= Bv_5Zv5c-Ts

これは、JavaScriptに慣れるための非常に基本的な知識を説明しています。

あなたはajaxリクエストのより短いバージョンでそれをすることができます、上のコードを見てください：

$.get("example.url.com", function(data) {
                console.log(data);
            }).done(function() {
               // TO DO ON DONE
            }).fail(function(data, textStatus, xhr) {
                 //This shows status code eg. 403
                 console.log("error", data.status);
                 //This shows status message eg. Forbidden
                 console.log("STATUS: "+xhr);
            }).always(function() {
                 //TO-DO after fail/done request.
                 console.log("ended");
            });

コンソール出力の例：

error 403 
STATUS: Forbidden 
ended

— PrzemysławSienkiewicz
ソース

1

完全な関数パラメーターを使用して、done、fail、およびalwaysを使用する方法の完全なコードを提供していただきありがとうございます。

— IvanD 2016

4

jqxhrはjsonオブジェクトです：

完全な戻り値：
jqXHR（jQuery 1.4.x、XMLHTTPRequest内）オブジェクトと、リクエストのステータスを分類する文字列（「成功」、「変更なし」、「エラー」、「タイムアウト」、「中止」、または「parsererror」）。

参照： jQuery ajax

あなたはそうするでしょう：

jqxhr.status ステータスを取得する

— ナフタリ別名ニール
ソース

2

注意：jQuery 3.4.1の使用

$.ajax({
  url: URL,
  success: function(data, textStatus, jqXHR){
    console.log(textStatus + ": " + jqXHR.status);
    // do something with data
  },
  error: function(jqXHR, textStatus, errorThrown){
    console.log(textStatus + ": " + jqXHR.status + " " + errorThrown);
  }
});

— サーフィンサンタ
ソース