2016-04-15 4 views
0

はHTMLです:このAJAXリクエストに対する応答としてHTMLファイルの内容が送信されたのはなぜですか(ノードサーバーがアクティブ)。ここ

<!DOCTYPE html> 
<html> 
    <head></head> 
    <body> 
     <script type="text/javascript" src="jquery-1.12.1.js"></script> 
     <script type="text/javascript" src="page.js"></script> 
    </body> 
</html> 

ここのページではJavaScriptです:私はHTMLページを立ち上げ、コンソールをチェックアウトすると、

var http = require('http'); 
http.createServer(function (request, response) { 
    response.statusCode = 200; 
    response.setHeader('Content-Type', 'text/plain'); 
    respone.write('Hello, dog'); 
    response.end(); 
}).listen(80); 
console.log('Server is running!!'); 

$(document).ready(function() { 
    var xhr = new XMLHttpRequest(); 
    xhr.onreadystatechange = function() { 
     if (xhr.readyState === 4) { 
      console.log(xhr.responseText); 
     } 
    }; 
    xhr.open('GET', ''); 
    xhr.send(); 
}); 

はここでノードサーバのJavascriptですHTMLページの内容を印刷しました(つまり、<!DOCTYPE html>で始まる)。私はノードサーバーから "Hello、dog"を印刷しようとしていましたが、おそらくブラウザがHTMLファイルからの応答を効果的に同じポートを介して受信していたため、

GETリクエストのURLをサーバーのJavascriptファイルに変更すると、実際にはそのファイルの内容が返されるというのは奇妙なことです。また、ボタンを追加してボタンのクリックでAJAXリクエストが発生した場合(つまり、その時点でページが既にロードされている場合)、HTMLファイルの内容はコンソールに印刷されます。

私はこのすべての仕組みを見てみることを実験しています。具体的には、リクエストとレスポンスの媒体としてHTMLを使用せずに、自分のページJavascriptをノードサーバとやり取りさせようとしています。私はまだTreehouse AJAXコースに取り組んでいますが、一般的には、コミュニケーションのためのリソースの設定については問題があります。ほとんどのリソースは、一方または他方を処理するように見えます。

答えて

0

上記の内容に基づいて、ブラウザーのlocalhost:80に移動したときに「Hello Dog」と表示されることが予想されます。つまり、すべてのサーバーが返すことができます。あなたは、静的なインデックスページを提供するために、あなたのルートを望んでいた場合は、お勧めできませんが、このような何かをする必要があると思います:述べたように

var http = require('http'); 
var fs = require('fs'); 
fs.readFile('./index.html', function (err, html) { 
    if (err) { 
     throw err; 
    }  
    http.createServer(function(request, response) { 
     response.writeHeader(200, {"Content-Type": "text/html"}); 
     response.write(html); 
     response.end(); 
    }).listen(80); 
}); 

ただし、これは推奨されません。一般的には、内容とルーティングを提供するための配管工事に役立つような、ある種のmiddlewareが必要です。はるかに私はexpressが最も一般的だと思います。これはroutingの概要です。もう1つはサービングstatic contentです。そこには自由な資源がたくさんあります。

関連する問題