2009-07-26 8 views
0

ここに10秒ごとにGoogleにpingをかけ、htmlのMonitorInformationエレメントへの接続ステータスを表示するJavaScriptコードです。しかし、デバッグするhtmlファイルをクリックすると、MonitorInformation要素に表示される情報は常に「接続中です...待機しています」。私はしばらくの間デバッグしましたが、わかりません。どのようなアイデアが私のコードに間違っていますか?javascriptはウェブサイトのコードに接続していません

HTMLコード:

<html xmlns="http://www.w3.org/1999/xhtml"> 
<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スクリプトコード:

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:私の修正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"> 
<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> 

を使用して事前のおかげで、 ジョージ

+1

JSONは機能しません。JSONPを使用する必要があります。JSONPは、当サービスが提供している場合にのみ機能します。 – FlySwat

+0

FlySwatが混乱していますが、JSONを使用してEDIT 1セクションに投稿したコードが動作します。コメントはありますか? – George2

答えて

1

AFAIKにアクセスできないドメインXHRをクロスドメインすることはできません。

+0

私は驚いています。私は別のサイトからページを取得し、私のサイトにメッシュアップするためにJavaScriptコードを使用することはできませんか? – George2

+0

ありがとうsoulscratch、JSONを使用してこの問題を修正しました。固定コードを確認してください。 (私は関数の動作をテストしましたが、あなたのようにGuruからのレビューは自分自身をより自信にしています:-))私のコードのEDIT 1セクションを参照してください。 – George2

2

URL以外のサイトに接続することはできません。コードがgoogle.comドメインにないかぎり、コードは機能しません。あなたはそれはあなたがそれを行うことができますようJSONP http://en.wikipedia.org/wiki/JSONを使用する必要がありますそのようにクロスサイトが呼び出しを行いたい場合は

これは、「同一生成元ポリシー」http://en.wikipedia.org/wiki/Same_origin_policy

と呼ばれるブラウザのセキュリティ項目です。

+0

AutomatedTesterありがとうございます、私はあなたのアドバイスに従ってこの問題を解決しました。固定コードを確認してください。 (私は関数の動作をテストしましたが、あなたのようにGuruからのレビューは自分自身をより自信にしています:-))私のコードのEDIT 1セクションを参照してください。 – George2

1

これは、非公開のiFrameを使用して、クロスドメインの制限を回避することができます。簡単な例は、あなたが始めるために:

(HTMLスニペット)

<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'; 
} 
+0

ありがとうFlySwat!私はwiki pedia(http://en.wikipedia.org/wiki/Same_origin_policy)からクロスサイトセキュリティポリシーについて学んでいます。このステートメントについては混乱しています。 "ポリシーは、同じサイトから発信されたページで実行されるスクリプトがお互いのメソッドとプロパティにアクセスする "、私は(1)ページ上で実行すると、クライアント側のブラウザでJavaScriptや他のスクリプトを実行することを意味するのは混乱していますか? (2)「お互いの他人の方法や性質」を意味するものは何ですか? DIVのinnerTextプロパティのようなアクセスプロパティではないURLにアクセスしています。あなたが明確にすることができればと感謝します。 :-) – George2

1

が、それはあなたがそこにセミコロンを忘れてしまったことだろうか?例:body onload = "setup();" ...

関連する問題