Ajax - Handle 404 error in jquery $.when

Sergiu Tripon

So I have the following code:

function ajax1(url) {
    return $.ajax({
        url: url
    });
}

function ajax2(url) {
    return $.ajax({
        url: url
    });
}

function ajax3(url) {
    return $.ajax({
        url: url
    });
}

function ajax4(url) {
    return $.ajax({
        url: url
    });
}

I then run the Ajax calls and access the data returned by each one using $.when:

$.when(ajax1(url), ajax2(url), ajax3(url), ajax4(url)).done(function(a1, a2, a3, a4){

});

Now, let's say one of the Ajax calls, ajax2, will return a 404 error.

How can prevent the script from executing and still return something (like false, to be accessed using the a2 variable) even when a 404 error is returned?

Thank you very much in advance.

charlietfl

jQuery 3 Deferreds are Promises A+ compliant. That means you can add a catch() to the request promise

Whenever you return from a catch() it resolves the promise and whatever is returned will be passed to the next then() in the chain

function ajax1(url) {
  return $.ajax({
      url: url
    })
    .then(data => data)
    .catch(resolveFailure);
}

function resolveFailure(jqXhr) { 
  // return whatever you want here. I added the status in case that is of interest
  // could return `false` or string or whatever
  // can also log any issues back to server if needed
  return {
    error: true,
    status: jqXhr.status,
    statusText: jqXhr.statusText
  };
}

var req = ajax1('https://api.myjson.com/bins/l9ywp'),
    req2 = ajax1('https://httpbin.org/FAIL'),
    req3 = ajax1('https://api.myjson.com/bins/l9ywp');

// could also replace `$.when with `Promise.all()`
$.when(req, req2, req3).then(function(r1, r2, r3) {
  // validate the arguments based on whatever you return in the catch()
  console.log('r1', r1);
  console.log('r2', r2);// object returned from catch()
  console.log('r3', r3);
});
.as-console-wrapper {max-height: 100%!important;top:0}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

jQuery ajax returning 404 error when passing URL as post data

404 error when binding named function with jQuery ajax inside

How to handle API call error with jQuery AJAX?

jQuery Ajax request with error 404 (not found) but it works

Jquery ajax is giving me a 404 not found error

Jquery, Ajax Error 404 with Webmethod url

Getting 404 error when calling ajax in WordPress

Handle session timeout when loading data through ajax with jquery DataTables

Spring Boot + Bootstrap + jQuery : Error 404 in $ajax call on Firefox

jQuery AJAX - Redirect to 404 page when load method fails

Handle error 404 with Spring controller

Handle 404 error with Express 4

PHP Ajax error, get 404 when type first char

jquery promise return when ajax call error

jQuery ajax requests repeats when error occurs

CORS error when jquery ajax request on api

Jquery/Ajax error when returning json of php

When are the different jQuery Ajax error codes returned?

jQuery Ajax Unexpected token < error on 404 instead of normal ajax error handler function

When sending jQuery post to MVC controller getting 404 error

How to handle error 404 when total items is lower than" per_page" flask pagination?

Handle Result Type in Ajax Jquery

jQuery ajax Get 404 Not Found

404 Not Found Ajax jquery MVC

jQuery AJAX error callback not being called when there is an error

Error when when uploading file from OneDrive via AJAX with JQuery

JQuery ajax stoppen in $.when when server returns 500 error

Wordpress Ajax returns a 404 error

Calling WCF with Ajax - 404 Error