建立服務器及請求響應等簡單的node.js例子

時間  2019-12-04
標籤 建立 服務器 請求 響應 簡單 node.js node 例子 欄目 Node.js 简体版
原文   原文鏈接

1 服務器

1.1 server.js建立服務器

http.createServer(function(request, response) {
    console.log("Request received");
    response.writeHead("200", { "Content-Type": "text/plain" });
    response.write("it works");
    response.end();
}).listen(8888);

console.log("Server has started");

1.2 模塊化server.js

var http = require("http");

function start() {
    http.createServer(function(request, response) {
        console.log("Request received");
        response.writeHead("200", { "Content-Type": "text/plain" });
        response.write("it works");
        response.end();
    }).listen(8888);

    console.log("Server has started");
}

exports.start = start; //導出模塊

1.3 引用server模塊

var server = require("./server"); //index.js文件中引用server模塊
server.start(); //模塊中start方法

2 路由

2.1 url模塊

var http = require("http");
var url = require("url"); //引用url模塊

function start() {
    http.createServer(function(request, response) {
        console.log("Request received");
        console.log(url); //url模塊有以下幾個方法
        //{ parse: [Function: urlParse],
        // resolve: [Function: urlResolve],
        // resolveObject: [Function: urlResolveObject],
        // format: [Function: urlFormat],
        // Url: [Function: Url] }

        console.log(request.url);
        //當訪問http://localhost:8888/index時返回以下結果：
        ///index
        ///favicon.ico

        console.log(url.parse(request.url)); //解析request.url，返回Url對象，結果以下：
        // Url {
        //   protocol: null,
        //   slashes: null,
        //   auth: null,
        //   host: null,
        //   port: null,
        //   hostname: null,
        //   hash: null,
        //   search: null,
        //   query: null,
        //   pathname: '/index',
        //   path: '/index',
        //   href: '/index' }        

        console.log(url.parse(request.url).pathname); //獲取pathname
        //當訪問http://localhost:8888/index時返回以下結果：
        ///index
        ///favicon.ico

        var pathname = url.parse(request.url).pathname;
        response.writeHead("200", { "Content-Type": "text/plain" });
        response.write("Request for " + pathname + " received."); //刷新頁面即顯示pathname
        //Request for /index received.

        response.end();
    }).listen(8888);

    console.log("Server has started");
}

exports.start = start;

2.2 router.js編輯路由

function route(pathname) {
    console.log("About to route a request for " + pathname);
}

exports.route = route;

2.3 引用router模塊

index.js文件編寫：html

var server = require("./server");
var router = require("./router"); //引用router模塊
server.start(router.route); //start方法傳入router模塊中的route方法

2.4 調用router.route方法

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

function start(route) {
    http.createServer(function(request, response) {
        console.log("Request received");
        
        var pathname = url.parse(request.url).pathname;
        console.log("Request for " + pathname + " received.");

        route(pathname); //調用route方法

        response.writeHead("200", { "Content-Type": "text/plain" });
        response.write("it works.");
        response.end();
    }).listen(8888);

    console.log("Server has started");
}

exports.start = start;

3 事件處理程序處理URL

3.1 requestHandlers.js

function start() {
    console.log("Request handler 'start' has called.");
}
function upload() {
    console.log("Request handler 'upload' has called.");
}
exports.start = start;
exports.upload = upload;

3.2 index.js引入requestHandlers模塊

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

var handle = {};
handle["/"] = requestHandlers.start;
handle["/start"] = requestHandlers.start;
handle["/upload"] = requestHandlers.upload;

server.startServer(router.route, handle);

3.3 修改server.js

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

function startServer(route, handle) {
    http.createServer(function(request, response) {
        var pathname = url.parse(request.url).pathname;
        route(handle, pathname);
        response.writeHead(200, { "Content-Type": "text/plain" });
        response.write("hello world");
        response.end();
    }).listen(8888);
}

exports.startServer = startServer;

3.4 修改router.js

function route(handle, pathname) {
    console.log("path: " + pathname);
    if (typeof handle[pathname] === "function") {
        handle[pathname]();
    } else {
        console.log("No request handler found for " + pathname);
    }
}

exports.route = route;

至此，咱們已經能夠經過輸入不一樣url來觸發不一樣的事件處理程序：node

index.js：npm

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

var handle = {};
handle["/"] = requestHandlers.index;
handle["/about"] = requestHandlers.about;
server.start(router.route, handle);

server.js：服務器

var http = require("http");
var url = require("url");
function start(route, handle) {
    http.createServer(function(request, response) {
        var pathname = url.parse(request.url).pathname;
        route(pathname, handle);

        response.writeHead(200, { "Content-Type": "text/plain" });
        response.write("hello");
        response.end();
    }).listen(8888);
}

exports.start = start;

router.js：模塊化

function route(pathname, handle) {
    console.log("path: " + pathname);
    if (typeof handle[pathname] === "function") {
        handle[pathname]();
    } else {
        console.log("404");
    }
}
exports.route = route;

requestHandlers.js：post

function index() {
    console.log("index page.");
}
function about() {
    console.log("about page.");
}
exports.index = index;
exports.about = about;

訪問localhost:8888/about會返回about page.ui

4 router路由處理response

4.1 修改server.js

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

function start(route, handle) {
    http.createServer(function(request, response) {

        var pathname = url.parse(request.url).pathname;
        route(pathname, handle, response); //response傳遞給route

    }).listen(8888);
}

exports.start = start;

4.2 修改router.js

function route(pathname, handle, response) {
    console.log("path: " + pathname);
    if (typeof handle[pathname] === "function") {
        handle[pathname]();
    } else {
        response.writeHead(404, { "Content-Type": "text/plain" });
        response.write("404 not found.");
        response.end();
    }
}
exports.route = route;

4.3 修改requestHandlers.js

function index(response) {
    console.log("index page.");
    response.writeHead(200, { "Content-Type": "text/plain" });
    response.write("wel zealzing.cn");
    response.end();
}

function about(response) {
    console.log("about page.");
    response.writeHead(200, { "Content-Type": "text/plain" });
    response.write("About us.");
    response.end();
}
exports.index = index;
exports.about = about;

固然，在router.js中也須要修改一下if-else循環語句中的部分：url

if (typeof handle[pathname] === "function") {
    handle[pathname](response); //傳入response參數
} else {
    response.writeHead(404, { "Content-Type": "text/plain" });
    response.write("404 not found.");
    response.end();
}

5 處理POST請求

5.1 生成表單

function index(response) {
    console.log("index page.");
    response.writeHead(200, { "Content-Type": "text/html" });
    var body = "<!DOCTYPE html>"+"<html lang='en'>"+"<head>"+"<meta charset='UTF-8'>"+"</head>"+"<body>"+"<form action='message' method='post'>"+"<label for='texture'></label>"+"<input type='text' name='texture'></input>"+"<input type='submit' value='submit'></input>"+"</form>"+"</body>"+"</html>";
    response.end(body);
}

function about(response) {
    console.log("about page.");
    response.writeHead(200, { "Content-Type": "text/plain" });
    response.write("About us.");
    response.end();
}
exports.index = index;
exports.about = about;

注意：頭部信息要改成text/html而不是text/plaincode

5.2 事件監聽器

事件監聽器分爲兩個部分：orm

request.addListener("data", function(chunk) {
    // body...a new chunk of data was received.
});
request.addListener("end", function() {
    // body...all chunks of data have been received.
});

5.3 增長事件監聽器

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

function start(route, handle) {
    http.createServer(function(request, response) {
        var postData = ""; //postData
        var pathname = url.parse(request.url).pathname;

        request.setEncoding("utf-8"); //encoding to utf-8
        request.addListener("data", function(chunk) {
            postData = postData + chunk; //received chunk...
            //console.log("Received POST data chunk " + chunk + "."); //輸出到log無關緊要
        });
        request.addListener("end", function() {
            route(pathname, handle, response, postData); //postData傳遞給route
        });
}).listen(8888);
}

exports.start = start;

5.4 修改router.js

function route(pathname, handle, response, postData) {
    console.log("path: " + pathname);
    if (typeof handle[pathname] === "function") {
        handle[pathname](response, postData); //傳入postData參數
    } else {
        response.writeHead(404, { "Content-Type": "text/plain" });
        response.write("404 not found.");
        response.end();
    }
}
exports.route = route;

5.5 最後再修改requestHandler

function index(response, postData) {
    console.log("index page.");
    response.writeHead(200, { "Content-Type": "text/html" });
    var body = "<!DOCTYPE html>"+"<html lang='en'>"+"<head>"+"<meta charset='UTF-8'>"+"</head>"+"<body>"+"<form action='/about' method='post'>"+"<label for='texture'></label>"+"<input type='text' name='texture'></input>"+"<input type='submit' value='submit'></input>"+"</form>"+"</body>"+"</html>";
    response.end(body);
}

function about(response, postData) {
    console.log("about page.");
    response.writeHead(200, { "Content-Type": "text/plain" });
    response.write("About " + postData + "."); //這裏返回數據
    response.end();
}
exports.index = index;
exports.about = about;

5.6 提取字段text值

若是直接使用上述代碼運行，當輸入值爲Oliver時：

About texture=Oliver.

顯然這不是咱們想要的，應該在requestHandler修改以下代碼：

var querystring = require("querystring"); //引入模塊
function index(response, postData) {
    console.log("index page.");
    response.writeHead(200, { "Content-Type": "text/html" });
    var body = "<!DOCTYPE html>"+"<html lang='en'>"+"<head>"+"<meta charset='UTF-8'>"+"</head>"+"<body>"+"<form action='/about' method='post'>"+"<label for='texture'></label>"+"<input type='text' name='texture'></input>"+"<input type='submit' value='submit'></input>"+"</form>"+"</body>"+"</html>";
    response.end(body);
}

function about(response, postData) {
    console.log("about page.");
    response.writeHead(200, { "Content-Type": "text/plain" });
    response.write("About " + querystring.parse(postData).texture + "."); //parseing
    response.end();
}
exports.index = index;
exports.about = about;

這樣就能夠了，若是在texture中填寫js腳本，node貌似也不會執行：

Received POST data chunk texture=%3Cscript%3Ealert%28%22wtf%22%29%3B%3C%2Fscript%3E.

server.js:

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

function start(route, handle) {
    http.createServer(function(request, response) {
        var postData = ""; //postData
        var pathname = url.parse(request.url).pathname;

        request.setEncoding("utf-8"); //encoding to utf-8
        request.addListener("data", function(chunk) {
            postData = postData + chunk; //received chunk...
            console.log("Received POST data chunk " + chunk + ".");
        });
        request.addListener("end", function() {
            route(pathname, handle, response, postData); //postData傳遞給route
        });
}).listen(8888);
}

exports.start = start;

index.js:

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

var handle = {};
handle["/"] = requestHandlers.index;
handle["/index"] = requestHandlers.index;
handle["/about"] = requestHandlers.about;

server.start(router.route, handle);

router.js:

function route(pathname, handle, response, postData) {
    console.log("path: " + pathname);
    if (typeof handle[pathname] === "function") {
        handle[pathname](response, postData); //傳入postData參數
    } else {
        response.writeHead(404, { "Content-Type": "text/plain" });
        response.write("404 not found.");
        response.end();
    }
}
exports.route = route;

requestHandler.js:

var querystring = require("querystring"); //引入模塊
function index(response, postData) {
    console.log("index page.");
    response.writeHead(200, { "Content-Type": "text/html" });
    var body = "<!DOCTYPE html>"+"<html lang='en'>"+"<head>"+"<meta charset='UTF-8'>"+"</head>"+"<body>"+"<form action='/about' method='post'>"+"<label for='texture'></label>"+"<input type='text' name='texture'></input>"+"<input type='submit' value='submit'></input>"+"</form>"+"</body>"+"</html>";
    response.end(body);
}

function about(response, postData) {
    console.log("about page.");
    response.writeHead(200, { "Content-Type": "text/plain" });
    response.write("About " + querystring.parse(postData).texture + "."); //parseing
    response.end();
}
exports.index = index;
exports.about = about;

6 文件上傳

直接使用formidable模塊：

npm install formidable

以及fs模塊讀寫硬盤中的文件

var fs = require("fs");
相關文章
相關標籤/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公眾號
   歡迎關注本站公眾號,獲取更多信息
聯繫我們 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程