2012-05-10 8 views
1

私はnode.jsアプリケーションを持っており、ホームページを読み込もうとするとエラーメッセージが表示されません。私は下の私のアーキテクチャをレイアウトするのに最善を尽くします。 index.js - > server.js - > router.js - > requestHandlers.jsexpressを使用して基本サーバーを設定する

私はexpress(www.expressjs.com)とnodebeginner.orgの組み合わせを使用しています。申し訳ありませんが、長い質問...できるだけ多くの情報を取得したい。

index.js(、パス名/のRequestHandler情報を含むオブジェクトを扱う作成する、サーバーを起動するために関数を呼び出す)私はここにrouter.routeで始まり、各ステップに沿って

var server = require("./server"); 
var router = require('./router'); 
var requestHandlers = require('./requestHandlers'); 

// Routes 

var handle = {} 
handle['/'] = requestHandlers.home; 

server.start(router.route, handle) 

server.jsを渡し(起動します>サーバー - 、これが)私は、サーバーを設定したい場合には、URLからのパス名を取得し、ルートモジュールに渡し

var http = require("http"); 
var url = require('url'); 
var express = require('express'); 

function start (route, handle) { 
    var onRequest = function(request, res) { 
     var pathname = url.parse(request.url).pathname; 
     console.log("request for " + pathname + " recieved."); 
     route(handle, pathname, res); 
    } 

    var app = express.createServer(onRequest).listen(8888); 
    if (app.configure) { 
     console.log('app exists'); //logging correctly 
    } 
    // Configuration 
    app.configure(function(){ 
    app.set('views', __dirname + '/views'); 
    app.set('view engine', 'jade'); 
    app.use(express.bodyParser()); 
    app.use(express.methodOverride()); 
    app.use(app.router); 
    app.use(express.static(__dirname + '/public')); 
}); 

app.configure('development', function(){ 
    app.use(express.errorHandler({ dumpExceptions: true, showStack: true })); 
}); 

app.configure('production', function(){ 
    app.use(express.errorHandler()); 
}); 

    console.log("Express server listening on port %d in %s mode", app.address().port, app.settings.env); //logs correct with 8888 and development 
} 

exports.start = start; 

router.js(インデックスから渡された関数のルートサーバーでありますrouter.jsのroute関数を呼び出し、requestHandleを呼び出しますハンドルオブジェクトにパス名と一致R)

function route (handle, pathname, res) { 

    console.log("About to route a request for" + pathname); //About to route a request for/stylesheets/style.css SEE BELOW******* this is the error 

if (typeof handle[pathname] === 'function') { 
     handle[pathname] (res); 
    } 
    else { 
     console.log('no request handler found for' + pathname); 
    } 
} 

exports.route = route; 

requestHandler.js(これらのパス名が要求された場合にのみルータのおかげと呼ばれる機能が特定のパス名にマップされ、RES/REQオブジェクトと相互作用する)

var home = function(res){ 
    res.render('index', { title: 'WWYB?' }); 
    console.log('homepage rendered'); //correctly logs for pathname = '/' 
    //click(); 
}; 

exports.home = home; 

** *私はローカルホストを要求するために行く:8888それはリクエストの束を作るしようとします。最初に「/」を正しく要求しますが、「/ stylesheets/style.cssのリクエストをルーティングする」と言っているすべてのログを記録し続けます。最終的にページはCSSなしで読み込まれます。私のlayout.jadeファイルに示されているパス名はまさに '/stylesheets/style.css'です。

パス名が/stylesheets/style.cssに評価されているのはなぜですか?私はノードがバックグラウンドで何かをしていると思うし、それを完全に理解していない。

詳細情報が必要な場合はお知らせください。ありがとう!

答えて

5

のために生成することができ、あなたが本当にマニュアルをチェックして、チュートリアルの束に従うべきでコメントしました。とにかく、少しお手伝いしようとします。

非常に基本的な説明です。 Expressを使用すると、サブアプリケーションを使用できるため、アプリケーションの別の部分を異なるファイルに置くことができます。それはそれ自身のルータも持っています。ルートが処理される前にリクエストや応答で何かをする必要がある場合は、ミドルウェアを作成することができます。別のモジュールに設定したい場合は、そこに関数を返します。

だから、server.jsの例:

var $express = require('express'), 
      app = module.exports = $express.createServer(), 
     subapp = require('./subapp'), 
    configure = require('./configure'); 

// Each of our own configure returns a function that will be 
// called by app.configure 
app.configure(configure.all(app)); 
app.configure('development', configure.devel(app)); 
app.configure('production', configure.prod(app)); 

// Use our sub application 
app.use(subapp); 

// Now listen 
app.listen(3030) 

subapp.js:

var $express = require('express'), 
    subapp = module.exports = $express.createServer(); 

// Add a handler for GET/to our sub-application 
subapp.get('/', function (req, res) { 
    res.end('Hello world!'); 
}); 

最後に設定します。JS:お好みのブラウザでlocalhost:3030

var $express = require('express'); 

exports.all = function (app) { 
    return function() { 
     // Global configurations 

     app.use($express.bodyParser()); 
     app.use($express.methodOverride()); 
     app.set('views', __dirname + '/views'); 
     app.set('view engine', 'jade'); 
     app.use($express.static(__dirname + '/public')); 
     //... 

     // If you want to do something with/on the request/response 
     // you can create a middleware 
     app.use(function (req, res, next) { 
     console.log('caught request %s %s', req.method, req.path); 

     // Don't forget the callback 
     next(); 
     }); 
    }; 
}; 

exports.devel = function (app) { 
    return function() { 
     // Development configurations 
    }; 
}; 

//... 

行く、それは「こんにちは、世界を!」が表示され、これが私たちの要求ハンドラです。ターミナルを見ると、 "catch GET /"と表示されます。これは私たちのミドルウェアです。

あなたのスタイルシート、クライアントサイドのJavaScriptなどは/ publicにする必要があります。 app.use(express.static(__dirname + '/public'))がこれに対応します。

は、でも生産に何かを展開することを考えて前に実験したノードについての詳細を学び、表現する必要があります、あなたは、あなたのヒスイのテンプレートで、あなたが今、このlink(rel='stylesheet', href='/public/stylesheets/all.css')

ようにそれを含めることができ、/public/stylesheets/all.cssを持っているとしましょうこれらのウェブサイトはあなたを助けることがあります。

この小さなマイクロツタがあなたを助けてくれることを願っています。

+0

ケビンにありがとうございます。あなたが提案したような別個のモジュールに構成を分けてみましたが、同じ問題がまだ発生しています。私はそれらのリンクをチェックアウトします。ありがとう! –

+0

なぜあなたのコードで単に '表現する'代わりに '$ express'変数名を使用しますか? – Erik

+0

名前の衝突を避けるのは単なる慣習です。パスモジュールを使用したいとしましょう。この規則を使用すると、パス引数をとる関数を作成できますが、あいまいさはありません。また、依存関係を保持する変数をすばやく認識して区別できます。いくつかの男はすべての帽子を使用していますが、私はこれは悪い考えです、私たちは通常、一定の値に使用し、モジュールは定数ではありません。また、多くのフロントエンドフレームワークでは、グローバルな名前空間としてドル記号が使用されているため、ドルの接頭辞は私にとって非常に一貫しています。 – kevin

4

これはかなり混乱してすごい迫力、あなたはアプリの急行で開始したいかもしれません(1)@TJHolowaychukようにあなた

+0

どういう意味ですか? –

+0

彼はおそらく './node_modules/express/bin/express --help'を意味します。 – elmigranto

+0

私の翡翠のファイルにリンクされているすべての私のスタイルシートと画像をルーティングしようとしています –

関連する問題