2

ノードjsで作成したローカルサーバーでxmlhttprequestを使用できない理由がわからないため、Express. お見せしましょう...ノードJSのサーバーは次のとおりです。

var 
express = require('express'),
app = express.createServer();

app.get('/count', function(req, res) {
    res.type('text/plain');
    res.write('Hello!')
     res.end();
});

app.listen(4003);

そして、それはうまくいきます！localhost:4003/count にアクセスすると、「Hello!」と表示されます。

サーバーに問題がないので、html ページを確認してみましょう。

<script>

var xmlhttp = new XMLHttpRequest();
var resp = ""
xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState==4 && xmlhttp.status==200){
        resp = xmlhttp.responseText;
        }
}

var cam = "localhost:4003/count"


function show(){
    xmlhttp.open("GET",cam,  true);
    xmlhttp.send();
    alert(resp);
}

</script>

<center><h1><div style="color:#339966"> <input type="button" value="Return of /count" onclick="javascript:show()"> </div> </h1>

したがって、それは機能しません =[、私はすでに試しました:

  • 、localhost:4003/countの変数 の値としてcam変更します。http://localhost:4003/count127.0.0.1:4003/count
  • Firefox、Safari、Chrome で開きます。
  • を表示しようとするxmlhttp.statusと、alert()「0」が表示されます。（ただし、ページはどのブラウザでも正常に開きます）
4

2 に答える 2

5

モーガンがすでにカバーしているタイミングの問題に加えて...

  • URL にホストを含​​める場合は、接頭辞を付ける必要があります//。

    var cam = "//localhost:4003/count";

    localhost:4003それ以外の場合は、ディレクトリ名としての相対パスとして扱われます。

  • Ajax を使用する場合は、 Same-Origin ポリシーにも対処する必要があります。

    そのため、ページに使用しようとしている場合file://、これは通常うまく機能しません。プロトコルにはFILEオリジンがないため、SOP を渡すことができず、次のようなエラーが発生します。

    Origin null is not allowed by Access-Control-Allow-Origin.

    最も簡単な解決策は、アプリケーションからもページを提供することです。

    static()ミドルウェアを使用して行うことができます。

    // `GET /` will serve `./public/index.html`
app.use(express.static(__dirname + '/public'));

    または、ファイル自体を送信する別のルートを使用します。

    app.get('/', function (req, res) {
    res.sendfile(__dirname + '/public/index.html');
});

    次に、次の場所からページにアクセスします。

    http://localhost:4003/

  • また、ページとcount現在同じオリジンから提供されているため、URL は単純にルートからの相対パスにすることができます。

    var cam = "/count";
于 2013-08-24T02:15:07.353 に答える
2

が呼び出されていないためalert(resp)、resp変数が割り当てられonreadystatechangeていません。アラートを移動するonreadystatechangeと、目的の効果が得られるはずです。これは、その値をページ内の に割り当てることができるポイントでもありElementます。

于 2013-08-24T01:34:59.290 に答える