2012-07-30 75 views
0

是否可以使用node.js動態創建一個頁面(路由)?使用node.js創建一個頁面/路由動態

說我在create-route.html文件(localhost:4001/create-route)的表單中有一個簡單的文本輸入,而我要輸入「my-page」, 然後這會帶我到使用localhost:4001/my-page的url顯示成功消息的新視圖。

我不太確定這是否可行,因爲我也不確定哪些節點模塊可以讓客戶端訪問createServer對象來操作它。 環顧'快車'被引用了很多路由,但我很期待在單獨的Node中查看這個框架是否可行。

任何幫助表示讚賞,謝謝。

webserver.js

var http = require('http') 
, url = require('url') 
, fs = require('fs') 
, server; 

// declare http object 
server = http.createServer(function(req,res){ 

    // parse the pathname as a url, get the trimmed route from the request 
    var path = url.parse(req.url).pathname; 

    // handle the various routes 
    switch(path){ 

    case '/': 
     fs.readFile(__dirname + '/index.html', function (err, data) { 
     if (err) throw err; 
     res.writeHead(200, {'Content-Type': 'text/html'}); 
     res.write(data, 'utf8'); 
     res.end(); 
     }); 


    case '/create-route': 
     fs.readFile(__dirname + '/create-route.html', function (err, data) { 
     if (err) throw err; 
     res.writeHead(200, {'Content-Type': 'text/html'}); 
     res.write(data, 'utf8'); 
     res.end(); 
    }); 

    // example of dynamically created 'route' 
    // "value' indicates the name that was inputted into the for on create-route.html, which in this case should be "my-page" 

    case '/value': 
     if (err) {throw err;} 
     var body = "<html>" + 
      "<head>" + 
      "<meta http-equiv='Content-Type' content='text/html'" + 
      "charset=UTF-8 />" + 
      "</head>" + 
      "<body>" + 
      "<p>youve just created a page called " + value + "</p>" + 
      "</body>" + 
      "</html>"; 
     res.writeHead(200, {"Content-Type": "text/html"}); 
     res.write(body); 
     res.end(); 
    }); 

    break; 

    default: send404(res); 
    } 
}); 

創建-route.html

<html> 
<head> 
    <title>Create a route</title> 
</head> 
<body> 
    <form action="/go-to-the-created-route"> 
     <label>Enter a route name:</label> 
     <input type="text" name="create-route" id="create-route"> 
     <button type="submit">Submit</button> 
    </form> 
</body> 
</html> 

更新的路由爲每一次反饋

這裏是更新的「走出去,TO-創建路線'路線按照@penartur反饋。

// Define the go-to-created-route 
routes["go-to-created-route"] = function (req, res) { 

// get the request url and split it to get the inputted value 
var reqPath = req.url; 
var splitPath = reqPath.split("="); 
var routeName = splitPath[(splitPath.length - 1)]; // outputs the value entered into text input 
//console.log(routeName); 

// create the new route by passing in the value of routeName, and display a page 
routes[routeName] = function (req, res) { 

// Not getting in here :(
    console.log("hello?"); 

    var body = "<html>" + 
     "<head>" + 
     "<meta http-equiv='Content-Type' content='text/html'" + 
     "charset=UTF-8 />" + 
     "</head>" + 
     "<body>" + 
     "<p>youve just created a page called " + routeName + "</p>" + 
     "</body>" + 
     "</html>"; 
    res.writeHead(200, {"Content-Type": "text/html"}); 
    res.write(body); 
    res.end(); 
}; 
}; 

回答

1

這是一個簡單的編程問題,與特定的Node.js沒有多大關係。該解決方案的草案:

var http = require('http') 
, url = require('url') 
, fs = require('fs') 
, server; 

var routes = {}; 

routes["create-route"] = function (req, res) { 
    fs.readFile(__dirname + '/create-route.html', function (err, data) { 
     if (err) throw err; 
     res.writeHead(200, {'Content-Type': 'text/html'}); 
     res.write(data, 'utf8'); 
     res.end(); 
    }); 
}; 

routes["go-to-the-created-route"] = function (req, res) { 
    var routeName = req.body["create-route"]; 
    routes[routeName] = function (req, res) { 
     var body = "<html>" + 
      "<head>" + 
      "<meta http-equiv='Content-Type' content='text/html'" + 
      "charset=UTF-8 />" + 
      "</head>" + 
      "<body>" + 
      "<p>youve just created a page called " + routeName + "</p>" + 
      "</body>" + 
      "</html>"; 
     res.writeHead(200, {"Content-Type": "text/html"}); 
     res.write(body); 
     res.end(); 
    }; 
}; 

// declare http object 
server = http.createServer(function(req,res){ 

    // parse the pathname as a url, get the trimmed route from the request 
    var path = url.parse(req.url).pathname; 

    var firstPart = path.split('/')[1]; 
    if (routes.hasOwnProperty(firstPart)) { 
     routes[firstPart](req, res); 
    } else { 
     send404(res); 
    } 
}); 
+0

'req.body'是不會設置,除非你已經調用了一些身體解析代碼(如'{快遞|連接} .bodyParser()')。 – ebohlman 2012-07-30 10:09:06

+0

當然。我試圖暗示如何完成任務。 – penartur 2012-07-30 10:34:59

+0

謝謝@penartur,很好的例子。 到目前爲止,我一直在看看所有遵循'switch'方法的教程,所以看到你的例子很棒。 我剛剛更新了我的原始問題,以解決用戶數據問題,而不是使用req.body獲取用戶數據。我的例子並不漂亮,但確實提取了我想要的信息。 然而,當它遇到'routes [routeName] = function(req,res){...}'時,它會下降。 你知道這可能是爲什麼嗎? 再次感謝你們倆。 – 2012-08-01 04:54:32