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.
[sourcecode language=”javascript”]
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);
}
};
[/sourcecode]
Para verificar se uma URL está online é só passá-la como parâmetro para o método.
[sourcecode language=”javascript”]checkOnline(‘http://www.thiagovespa.com.br’, function() {alert(‘Fora do ar!’)}, function(){alert(‘Online’)});[/sourcecode]
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.
[sourcecode language=”javascript”]
function checkImgOnline(imageUrl, error, ok){
var img = new Image();
img.src = imageUrl;
if(img.height>0){
ok();
} else {
error();
}
}
[/sourcecode]
Aí é só utilizar uma imagem como parâmetro.
[sourcecode language=”javascript”]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’)});
[/sourcecode]
Com isso, o possível problema com javascript é evitado, mas você depende de uma imagem para fazer a requisição.