How to avoid this "brute force" idea regarding my project?

Question

I'm working on a school project right now which is based on the Vine website. Basically the goal of my project is to display on a screen many videos (from vines url) playing one by one.

First I use the following process : I put an Iframe in my html code and then I update the src of this Iframe every 6 seconds, for the moment this step works perfectly ! Every 6000 milliseconds videos are switching between them.

If this step works it's because I already have my three links stored as Strings in an array and then I simply called a function which chose a random index in this array.

BUT now I encounter a bigger problem, what I want to do is to add working links (by "working" I obviously mean valid, when I try to reach the URL it does not return 404) into my array, and the issue is that I don't really know how to handle this but I guess there is no thousands solutions.

My main idea was a kind of brute force : I wanted to generate random links and tried every generated links' connection. The function which creates the random links is done but my issue is when it comes to check the connectivity.. I tried a XML method from this thread then I found other topics about it and I ended up with it :

function testUrlConnection(urlCheck){

"use strict";

var xhr = new XMLHttpRequest();

xhr.open('HEAD', file, true);   
xhr.setRequestHeader("Access-Control-Allow-Origin","*")
xhr.send();

console.log(xhr.status); //return 0 no matter what

        if (xhr.status != "404") {
            console.log(urlCheck + " connection exist!");
    } else {
            console.log(urlCheck+ " connection doesn't exist!");
        }
}

Thus I tried a lot of modifications but I discovered that it was an Origin or Domain issue.

Sorry for making it long but actually this is not really a code issue but more a way of handling this, do you think this "brute force" idea can be pursued or do I need to handle this in any other way ? If yes which advice can you give me ?

Thank you, NEAK

Answer 1

While this idea works I think you should try a different approach, like infinite scrolling. Like Facebook, it works so that as a user is scrolling down the page more and more content gets loaded. This means you don't have to load a bunch of content at once, but you have to keep track of where the user on the page.

Regardless of what way you load the videos, you have to get valid urls to your videos. It sounds like you got the URL generator, and to make sure the URL doesn't return a 404 I'd do something like this: Checking if a URL is broken in Javascript.

Good luck!