Verificar se uma URL está online via javascript

Em um dos clientes surgiu a necessidade de verificar se o usuário tem acesso à uma URL específica, como por exemplo: facebook, twitter. Já que em algumas empresas o acesso à redes sociais é bloqueado.

Como solução foi verificar se a URL é carregada no browser ou não. Com isso em mente, carreguei a URL em um elemento do tipo script e alterei o atributo src para a url a ser verificada. Caso seja carregado com sucesso executo uma função de erro, caso contrário executo uma função de sucesso.

function checkOnline(url, error, ok) {
	try {
        var scriptElem = document.createElement('script');
        scriptElem.type = 'text/javascript';
        scriptElem.onerror = function(){error();};
        scriptElem.onload = function(){ok();};
        scriptElem.src = url;
        document.getElementsByTagName("body")[0].appendChild(scriptElem);
	} catch(err) {
    	error(err);
	}
};

Para verificar se uma URL está online é só passá-la como parâmetro para o método.

checkOnline('http://www.thiagovespa.com.br', function() {alert('Fora do ar!')}, function(){alert('Online')});

Ainda não testei no IE, mas creio que não deva ter nenhum problema. Se alguém puder testar pra mim, ficarei grato :).

Esse tipo de solução não é facilmente feita com ajax, devido às restrições de segurança contidas no browser.

Entretanto essa abordagem pode ocasionar erros de javascript ao carregar uma página dentro da tag script. Para evitar esse tipo de problema, você pode utilizar uma imagem para verificar se o site está online. Dei uma incrementada no código encontrado no stackoverflow.

function checkImgOnline(imageUrl, error, ok){
     var img = new Image();
     img.src = imageUrl;
     if(img.height>0){
       ok();
     } else {
       error();
     }
}

Aí é só utilizar uma imagem como parâmetro.

checkImgOnline('http://www.thiagovespa.com.br/blog/wp-content/themes/thiagovespa-blog-theme/images/wasp2-mini.png', function() {alert('Fora do ar!')}, function(){alert('Online')});

Com isso, o possível problema com javascript é evitado, mas você depende de uma imagem para fazer a requisição.

Sobre: Thiago Galbiatti Vespa

Thiago Galbiatti Vespa é mestre em Ciências da Computação e Matemática Computacional pela USP e bacharel em Ciências da Computação pela UNESP. Coordenador de projetos do JavaNoroeste, membro do JCP (Java Community Process), consultor Oracle, arquiteto de software de empresas de médio e grande porte, palestrante de vários eventos e colaborador de projetos open source. Possui as certificações: Oracle Certified Master, Java EE 5 Enterprise Architect – Step 1, 2 and 3; Oracle WebCenter Portal 11g Certified Implementation Specialist; Oracle Service Oriented Architecture Infrastructure Implementation Certified Expert; Oracle Certified Professional, Java EE 5 Web Services Developer; Oracle Certified Expert, NetBeans Integrated Development Environment 6.1 Programmer; Oracle Certified Professional, Java Programmer; Oracle Certified Associate, Java SE 5/SE 6