tags:

views:

352

answers:

4
Q: 

javascript connect to web site code not working

Hello everyone,

Here is my javascript code which ping Google for every 10 seconds and display the connection status to html MonitorInformation element. But when I click the html file to debug, the information displayed at MonitorInformation element is always "Connecting...wait". I have debugged for some time but can not figure out. Any ideas what is wrong with my code?

Html code:

<html xmlns="http://www.w3.org/1999/xhtml"&gt;
<head>
<script src="Monitor.js" type="text/javascript"></script>
    <title>Web Site Monitor</title>
</head>
<body  onload="setup()">
<div id="MonitorInformation">Connecting...wait</div>
</body>
</html>

Java script code:

function setup() {
    window.setInterval(PingWebSite, (10 * 1000));
}

function PingWebSite() {
    conObj = new ActiveXObject("Msxml2.XMLHTTP");
    conObj.open("GET", "http://www.google.com", true);
    conObj.onreadystatechange = function() {
    if (conObj.readyState === 4) {
        if (conObj.status === 200) { 
       loading.innerText = "Service is available";    
      } else {
          MonitorInformation.innerText = "Service is not available";
      }
        } else {
            MonitorInformation.innerText = "Connecting to www.google.com ...";
     }
    }
}

EDIT 1: my fix using JSON

function setup() {
    window.setInterval(PingWebSite, (10 * 1000));
}

function PingWebSite() {

    var http_request = new XMLHttpRequest();
    http_request.open("GET", "http://www.google.com", true);
    http_request.send(null);
    http_request.onreadystatechange = function() {
        if (http_request.readyState == 4) {
            if (http_request.status == 200) {
                MonitorInformation.innerText = "Connection ok";
                alert("ok");
            } else {
            MonitorInformation.innerText = "Connection fail";
            alert("fail");
            }
            http_request = null;
        }
    };
}

<html xmlns="http://www.w3.org/1999/xhtml"&gt;
<head>
<script src="Monitor.js" type="text/javascript"></script>
    <title>Web Site Monitor</title>
</head>
<body  onload="setup()">
<div id="MonitorInformation">Connecting...wait</div>
</body>
</html>

thanks in advance, George

+1  A: 

You can't cross domain XHR for which you don't have access to AFAIK.

meder  2009-07-26 13:50:49
I am surprised. I cannot use javascript code to get page from another site and mesh-up to my site?
George2  2009-07-26 14:12:40
Thanks soulscratch, I have fixed this issue by using JSON, could you review my fixed code please? (I have tested function works, but review from Guru like you is making myself more confident. :-) ) Please refers to EDIT 1 section of my code.
George2  2009-07-26 14:29:01
+2  A: 

You can't connect to a site outside of your URL. Unless your code is on the google.com domain it won't work.

This is a browser security item called 'Same origin policy' http://en.wikipedia.org/wiki/Same_origin_policy

If you want to do cross site calls like that you will have to use JSONP http://en.wikipedia.org/wiki/JSON as that lets you do that.

AutomatedTester  2009-07-26 13:52:13
Thanks AutomatedTester, I have fixed this issue following your advice, could you review my fixed code please? (I have tested function works, but review from Guru like you is making myself more confident. :-) ) Please refers to EDIT 1 section of my code.
George2  2009-07-26 14:23:50
+1  A: 

You can do this using a hidden iFrame to get around the cross domain limitations. A quick example to get you started:

(HTML Snippet)

<body>
    <div style="display: none;">
        <iframe id='hiddenFrame'></iframe>
    </div>
</body>

Javascript:

function setup()
{
    var iFrame = document.getElementById('hiddenFrame');
    var changeEvent = function () 
    { 
        loading.innerText = "Service is Available";
    }
    // IE
    iFrame.onload = changeEvent;
    // Firefox
    iFrame.onreadystatechange = changeEvent;

    setInterval(PingWebSite, (10 * 1000));
}

function PingWebSite() {
    var iFrame = document.getElementById('hiddenFrame');
    iFrame.src = 'http://www.google.com';
}
FlySwat  2009-07-26 14:32:51
Thanks FlySwat! I am learning about cross site security policy from wiki pedia (http://en.wikipedia.org/wiki/Same_origin_policy), and I am confused about this statement -- "the policy permits scripts running on pages originating from the same site to access each other's methods and properties", I am confused about (1) running on pages means running javascript or other scripts on client side browser? (2) what means "each other's other's methods and properties"? I am accessing URL not access property like DIV's innerText property. Appreciate if you could clarify. :-)
George2  2009-07-26 15:23:29
A: 

Could it be that you forgot a semicolon there? E.g.: ...body onload="setup();"...

Timmy  2010-09-13 15:44:12

related questions

What JavaScript patterns do you use most?
Javascript events
What style do you use for creating an "class" in JavaScript?
Graphing JavaScript Library
What's the difference in closure style
Getting the text from a drop-down box
How to specify javascript to run when ModalPopupExtender is shown
Length of Javascript Associative Array
How Do I Post and then redirect to an external URL from ASP.Net?
How to set up a CSS switcher in ASP.NET
Wrapping lists into columns
Javascript keyboard events primer? (or rather: help me with my custom dropdown)
Http Auth in a Firefox 3 bookmarklet
Best Debugging Tools for JavaScript/xulrunner Development
How can I turn a string of HTML into a DOM object in a Firefox extension?
Call ASP.NET Function From Javascript?
Javascript troubleshooting tools in IE
MAC addresses in JavaScript
Capturing TAB key in text box
CSS Background Color in Javascript
How can I make the browser see CSS and Javascript changes?
Triple Quotes? How do I delimit a databound Javascript string parameter in ASP.NET?
ASP .Net Custom Client-Side Validation
What JavaScript library would you choose for a new project and why?
Detecting font in JavaScript