How to do a simple "ping" on external sites returning status: 200, 400

Asked

Viewed 1,667 times

2

I’m a beginner in Javascript, Angularjs and jQuery. I have already broken my head here and I could not solve the following solution using as a basis the Javascript:

I want to make a list of the sites I’ve developed, showing their status in real time using Javascript - if they’re online add a class to div with a green color, otherwise I use another color.

'Solutions' I found, but they did not work:

  • Fetch_API: I used, but not all sites returned an object json with the status of the site.
  • XMLHttpRequest(): I researched about, but on the console says it is obsolete to use this.

I’m not sure those solutions are the best. The idea is simple: the script makes a request to the site I want and returns its status if it is 200(ok), 500, 400 or other and I will manipulate my front-end according to the result.

javascript jquery angularjs ajax requisition

  • See if the example below helps you. http://stackoverflow.com/questions/4282151/is-it-possible-to-ping-a-server-from-javascript

  • Okay Ismael, or take a look there now... Thank you!

  • Hello Ismael, unfortunately it didn’t work...

  • There is an alternative to knowing if it is 200 or if it is different from 200, without getting the exact code, that is it can be 400, 500... I don’t know if that would be enough for your case.

  • Hello Inkeliz, it would be interesting too.

2 answers

3

Unfortunately there is no way to implement such a solution using only Angular (or any other client-side technology such as jQuery) because of Same-origin policy, or same origin policy.

You can use CORS, adding the domain where your verification tool is running to all white-lists of its websites, to enable Angular to access the resources of its individual domains.

If you do not have permissions to manipulate white-lists you can still implement a solution to be executed from a server, where a direct connection can be established - and the status of the remote applications evaluated individually.

0

Opa Thanks for the guide. I ended up finding a solution in jQuery, basically it is an external service where it requests the site I want to consult and returns an object json with the site information (variavel.status) or the whole Html of the site.

I found a solution also in PHP who does something similar, but who gathers more information and does not need an external service. I’ll leave the code here for those who have to build a similar solution.

Javascript:

		$.getJSON('http://whateverorigin.org/get?url=' + encodeURIComponent('http://www.facebook.com') + '&callback=?', function(data){
			if(data){
				console.log(data.status);
			}else{
				return("servidor offline");
			}
		});	
<!DOCTYPE html>
<html>
<head>
	<title>Angular Curl</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.1/jquery.min.js"></script>
</head>
<body>

	<h3 style="text-align: center">Mostre o Console para ver o Retorno do Objeto</h3>

</body>
</html>

And below in PHP:

<!DOCTYPE html>
<html>
<head>
    <title>Ping Site</title>
</head>
<body>


<?php

    function curl_info($url){
    $ch = curl_init();
    curl_setopt( $ch, CURLOPT_URL, $url );
    curl_setopt( $ch, CURLOPT_HEADER, 1);
    curl_setopt( $ch, CURLOPT_RETURNTRANSFER, 1 );
    // curl_setopt( $ch, CURLOPT_CONNECTTIMEOUT, $timeout );
    curl_setopt( $ch, CURLOPT_FOLLOWLOCATION, 1 );

    $content = curl_exec( $ch );
    $info = curl_getinfo( $ch );

    return $info;
    }

    $site = 'http://www.honda.com/';
    $info = curl_info( $site );

    if( $info['http_code']==200 || $info['http_code']==302 || $info['http_code']==301) {
        echo '<u>'.$site . "</u> - <b style='color:lightgreen; font-size: 18px; text-transform: uppercase'>está no ar!!</b><br />";
        var_dump($info);
    } else {
        echo '<u>'.$site . "</u> - <b style='color:red; font-size: 18px; text-transform: uppercase'>está fora do ar!!</b><br />";
        var_dump($info);
    }
?>

</body>
</html>

Browser other questions tagged javascript jquery angularjs ajax requisition

You are not signed in. Login or sign up in order to post.