How do I simply ping external sites returning status: 200, 400

Question

How do I simply ping external sites returning status: 200, 400

Navigation

#1 by (3 votes)
#2 by (0 votes)

2

I'm a beginner in JavaScript , AngularJS and jQuery . I have already broken my head here and could not resolve the following solution using JavaScript :

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

'Solutions' that I found but did not work:

Fetch_API : I used, but not all sites returned a json object with site status.
XMLHttpRequest() : I searched, but on the console it says that it is obsolete to use this.

I do not know if these solutions are the best. The idea is simple: the script makes a request for the site I want and returns its status if it is 200 (ok), 500, 400 or another and I'm going to manipulate my front end accordingly.

javascript jquery angularjs ajax

asked by anonymous 25.11.2016 / 18:53

2 answers

How to manipulate objects in a Thread? Problem converting String to Date

score 3 · Answer 1

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

You can use CORS by adding the domain where your verification tool is being run to all white-lists of your sites , to allow Angular to access resources from their individual domains.

If you do not have white-lists manipulation permissions, you can still implement a workaround from a server , where a direct connection can be established - and the state of remotely evaluated individual applications.

score 0 · Answer 2

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

I also found a solution in PHP that does something similar, but that 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.

In 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><h3style="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>