How can I check the 410 status of an iframe?

Question

I'm building a page that uses the Slideshare API to pull a limited set of presentations from a specific Slideshare user and output a series of iframes with those presentations embedded.

For the most part the page is working as intended, however one of the presentations that the API is calling was recently deleted, and therefore when the page loads that iframe the browser returns a 410. Unfortunately there is no object in the XML returned by Slideshare that can be used to determine if that particular presentation has been deleted.

Therefore I would like to check for the 410 error prior to adding that particular iframe to the page. What's making this difficult for me is that the error doesn't appear when making the API call, but rather when the embedded iframe loads, so I don't know where or how to make the appropriate check.

Here's the relevant code:

$.ajax({
url: slideShareURL,
dataType: 'XML',
success: function(data) {
    var allSlides = x2js.xml2json(data);
    allSlides = allSlides.User.Slideshow;
    for (i = 0; i < allSlides.length; i++) {
        document.getElementById('slides').innerHTML += allSlides[i].Embed;
    }
}
});

Notes:

slideShareURL is defined earlier in the code using the API
I'm using xml2json.js to convert the XML received from the API to a json object
allSlides is an array of presentations each containing a set of objects such as slide title, id, download URL, etc
Embed is the object that contains the full iframe embed code

EDIT: Answer provided by Christophe below was almost perfect, but I had to add a closure to make the second ajax call work within the for loop.

score 1 · Accepted Answer · answered Nov 17 '17 at 11:13

1

Hmmm,what about this solution :

$(function() {
    $.ajax({
        url: "www.domain.com/iframe",
        dataType: "jsonp",
        timeout: 5000,

        success: function () {
            $("#iframe").attr("src", "www.domain.com/iframe");
        },
        error: function (parsedjson) {
            if(parsedjson.status == "200") {
                $("#iframe").attr("src", "www.domain.com/iframe");
            } else {
                // Handle error
            }
        }
    });
});

answered Nov 17 '17 at 11:13

Christophe

408
2
10

Thanks for the reply. But unless I'm misunderstanding, the problem with this solution is that it assumes the iframe already exists on a webpage - but the only way I've been able to generate the 410 error is to actually dynamically include the iframe on my page, and by that time it's too late. Ideally I'd like to check the status of the iframe code only (that is, ) before including it on my page. – Moss Nov 17 '17 at 12:46
Thanks, this was in fact what I needed with just one missing piece - I realized I was having issues with the for loop and the asynchronous ajax call. I solved it and posted my solution below. – Moss Nov 17 '17 at 13:53

score 1 · Answer 2 · answered Nov 17 '17 at 13:52

The answer provided by Christophe put me on the right track, but it wasn't possible to run the second ajax call properly within the for loop. After some more research I learned about closures, and came up with the following:

$.ajax({
    url: slideShareURL,
    dataType: 'XML',
    success: function(data) {
        var allSlides = x2js.xml2json(data);
        allSlides = allSlides.User.Slideshow;

        for (i = 0; i < allSlides.length; i++) {

        (function(i) {
                var slideURL = allSlides[i].SlideshowEmbedUrl;
                $.ajax({
                    url: slideURL,
                    success: function () {
                        document.getElementById('slides').innerHTML += allSlides[i].Embed;
                    },
                    error: function () {
                        console.log('Failed to load');
                    }
                })
            })(i);
        }
    }
});

How can I check the 410 status of an iframe?

2 Answers2