成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码

資訊專欄INFORMATION COLUMN

Express + Ejs實(shí)現(xiàn)一個(gè)簡單的WebServer

Tonny / 2861人閱讀

摘要：最近在看，讀完官方的起步教程后想著該自己折騰點(diǎn)東西，就先用實(shí)現(xiàn)一個(gè)超簡單的，主要記錄下思路。先推薦一個(gè)入門級的簡單實(shí)戰(zhàn)項(xiàng)目地址。不過鑒于初學(xué)，自身的思路肯定不會是最佳實(shí)踐，慢慢積累。

最近在看node.js，讀完官方的起步教程后想著該自己折騰點(diǎn)東西，就先用express + ejs實(shí)現(xiàn)一個(gè)超簡單的webserver，主要記錄下思路。先推薦一個(gè)nodejs入門級的簡單實(shí)戰(zhàn)項(xiàng)目地址。很適合入門級上手：https://github.com/nswbmw/N-b...

思路

因?yàn)楸旧頉]有后端相關(guān)語言開發(fā)實(shí)戰(zhàn)經(jīng)驗(yàn)，所以學(xué)習(xí)nodejs過程中，更多是思路和理念的學(xué)習(xí)和理解，語言只是工具。不過鑒于初學(xué)，自身的思路肯定不會是最佳實(shí)踐，慢慢積累。

實(shí)現(xiàn)一個(gè)簡單的webserer肯定需要以下幾個(gè)東西：

路由：router 對于不同請求路徑分發(fā)對應(yīng)的事件處理程序

事件處理程序 routerHandler 分別處理對應(yīng)的事件

返回模板 views 處理后返回的模板，這里選用的是服務(wù)端渲染

思路有了，先安裝express和ejs，切換到對應(yīng)目錄下：npm i express ejs
建立文件目錄：

MyServer
    |__index.js
    |__routers
    |   |__index.js
    |   |__users.js
    |__views
    |   |__users.ejs
    |__node_modules
    |__package.json

index.js：作為入口文件，也作為路由（因?yàn)槭且粋€(gè)簡單server，可以先這么處理）

routers：存放不同路徑對應(yīng)的事件處理程序

views：存放模板

關(guān)于express和ejs的使用網(wǎng)上文檔已經(jīng)夠多了，所以只記錄用到的。

1.index.js 
const path = require("path");

const express = require("express");
const app = express();

const indexRouter = require("./routers/index");
const usersRouter = require("./routers/users");

app .set("views", path.join(__dirname, "views"))
    .set("view engine", "ejs")
    .use("/",indexRouter)
    .use("/users", usersRouter)
    .listen(666, "127.0.0.1");

path: path是nodejs核心模塊之一，主要處理與文件路徑和目錄相關(guān)的數(shù)據(jù)，下面的path.join方法是講參數(shù)中的path片段拼接處理成規(guī)范的文件路徑，其中的__dirname是指當(dāng)前文件所在的完整的絕對路徑；

express: express基于 Node.js 平臺，快速、開放、極簡的 web 開發(fā)框架。這里用到的就是express最典型的的應(yīng)用方式，express返回一個(gè)function(req,res,next)；next先不講，app.use簡單理解就是針對第一個(gè)參數(shù)對應(yīng)路徑(如果第一個(gè)參數(shù)是路徑)，就執(zhí)行對應(yīng)的function；下文中的app.set方法是設(shè)置一些屬性，http://www.expressjs.com.cn/4...；這里設(shè)置了response引用的view（模板）和對應(yīng)的view engine（模板引擎）；

indexRouter/usersRouter: 分別引入不同請求對應(yīng)的處理函數(shù)以方便調(diào)用；

2.routers/

index.js

const express = require("express");
const router = express.Router();

router.get("/", function(req, res){
    res.send("express is started! this is index!");
})

module.exports = router;

users.js

const express = require("express");
const router = express.Router();

router.get("/:name", function(req, res){
    res.render("users",{
        name: req.params.name,
        id: req.query.id
    });
})

module.exports = router;

這里的思路也很簡單，引入express，調(diào)用router中間件，
/:name: 這個(gè)其實(shí)是個(gè)占位符，代表的是/前面的字段的值，可以通過requset.params取到，比如如果訪問的是127.0.0.1:666/users/laoli，這里通過requset.params.name取到的值就是laoli；
req.query: 其實(shí)就是取?后面的參數(shù)，比如訪問127.0.0.1:666/users/laoli?age=18，這時(shí)通過req.query.age取到的值就是18；
res.render: 就是取模板，將后一個(gè)ocject中參數(shù)值傳入模板渲染后返回

3.users.ejs 



    
    idnex
    


    
<%= name.toUpperCase() %>

    
hello, <%= name %>, your ID is <%= id %>

ejs模板文件，ejs很簡單好用，文檔也很多。http://ejs.co/

以上，完成后在命令行中運(yùn)行node index.js，然后頁面訪問127.0.0.1:666/users/laoli?id=18就會得到如下頁面：

其中的請求和響應(yīng)如下：

一個(gè)簡單的webserver算式跑起來了，當(dāng)然，在此基礎(chǔ)上可以新增一些簡單的功能，比如表單提交的處理，ajax異步提交并響應(yīng)。這個(gè)接下來去做嘗試。

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://m.hztianpu.com/yun/82719.html

相關(guān)文章

  • Express 實(shí)戰(zhàn)（七）：視圖與模板：Pug 和 EJS

    摘要：而框架中最常用的兩個(gè)視圖引擎是和。實(shí)際上這些上下文對象就是會在視圖中使用到的變量。其實(shí)視圖緩存并不是緩存視圖實(shí)際上它緩存的視圖路徑。根據(jù)默認(rèn)視圖引擎將缺少拓展名的視圖文件補(bǔ)充完整。實(shí)際上存在由不同組織維護(hù)的兩個(gè)不同版本的。 showImg(https://segmentfault.com/img/remote/1460000010821004);前面的內(nèi)容大都是關(guān)于 Express 框...

    wmui 評論0 收藏0

  • Express 實(shí)戰(zhàn)（三）：Express 基礎(chǔ)

    摘要：同樣的的框架中也有被稱為中間件概念。所以，整個(gè)工作流有兩種可能情形另外，這些中間件函數(shù)中部分函數(shù)需要對響應(yīng)做出響應(yīng)。擴(kuò)展和在原來基礎(chǔ)上對和對象進(jìn)行了功能擴(kuò)展。除了對響應(yīng)對象進(jìn)行了拓展之 Express 框架的初衷是為了拓展 Node 內(nèi)置模塊的功能提高開發(fā)效率。當(dāng)你深入研究后就會發(fā)現(xiàn)，Express 其實(shí)是在 Node 內(nèi)置的 HTTP 模塊上構(gòu)建了一層抽象。理論上所有 Express...

    KoreyLee 評論0 收藏0

  • 多屏互動——H5 中級進(jìn)階

    摘要：手機(jī)屏幕朝上，水平靜止放置，軸重力加速度為，為。當(dāng)手機(jī)水平放置，撥動手機(jī)，使其慢慢旋轉(zhuǎn)，重力加速度的數(shù)據(jù)并沒有變化。四元數(shù)的基本數(shù)學(xué)方程為其中表示旋轉(zhuǎn)角度，表示旋轉(zhuǎn)軸。四元數(shù)表示一個(gè)完整的旋轉(zhuǎn)。 前言 隨著智能硬件的普及，手機(jī)，平板，PC甚至路邊的電子廣告牌，現(xiàn)代瀏覽器已經(jīng)無處不在。在瀏覽器里編織出我們自己的一片天地已經(jīng)輕車熟路，但是這還不夠，H5賦予了瀏覽器太多的新特性，等待我們?nèi)ナ?..

    wdzgege 評論0 收藏0

  • 60分鐘學(xué)會使用Node.js+Express+Ejs+mongoDB

    摘要：安裝完畢后，打開終端，在終端分別輸入如下命令，檢測是否安裝成功。號會告訴安裝最新版本。它會為每一條記錄創(chuàng)建一個(gè)唯一的值。注意我們不需要提前創(chuàng)建這個(gè)，它會在第一次使用的時(shí)候自動創(chuàng)建。我們可以使用，這是我最常用的方式。 60分鐘學(xué)會使用Node.js+Express+Ejs+mongoDB 本文出自從零到壹全棧部落 (Node+Vue+微信公眾號開發(fā))企業(yè)級產(chǎn)品全棧開發(fā)速成周末班首期班(1...

    BicycleWarrior 評論0 收藏0

發(fā)表評論

0條評論

閱讀需要支付1元查看
<