Node學習記錄: 路由解析

以 express視角
網址能夠訪問  express構建了一個web server
var expresss=require('express');
是一個web後端 開發框架 第三方npm 包
npm i express --save
web server 就是一個運行app實例
var app=express();
監聽端口 
app.listen(3000)
 
處理路由,將響應不一樣的地址訪問。
分模塊構建路由,
var router=express.Router();
 
router.get('/', (req, res) => {
  res.send('hello, express');
});
 
app.use('/', indexRouter);
 
什麼叫作html模板
express 有些高效的html工具
ejs是廣爲流行的 。 
 
web server核心的模式是mvc
model 數據 (數據庫)
control 控制器(路由)
view (視圖) html
將視圖添加到 webserver裏面 
views 模板文件  指明目錄在哪裏
設置模板引擎用的是什麼
 
模板語法 
<%%>  用於js語法的嵌入,ejs html 部分就是這個模子 
數據由router render 第二個參數傳過來
= 表示值輸出
什麼都沒有js語句執行 邏輯運算
-用於html解析  默認狀況 它會將html處理爲文本。
<%- include('header')%>
模板組裝語法 有利於代碼的複用
 
中間件  從請求到返回,在這段段過程當中間 由一個個中間件來陸續完成想應的功能,
epress架構思想,流水線
使用中間件
app.use()
function(err,req,res,next){}
第三方中間件
next方法  若是不使用next 就認爲請求結束。
res.render()
res.end()
這些方法也會中止中間件的傳播
 
錯誤處理
1 讓開發者明白  除了什麼錯  。
next(new Error())
2 錯誤 不能直接拋給用戶  專門的錯誤處理中間件
app.use(function(err,req,res,naxt){
console.log(err.stack)
res.status(500).send(something broken))
}
 
博客 目錄分析  
models  存放數據庫的文件  M
routes 存放路由文件 C
views  存放模板文件 V
public 存放靜態資源 
index.js  程序文件  入口文件
package.json  項目描述  做者 依賴等。

github

要代碼戳這裏html

文件路徑型

圖片描述

根據不一樣請求路徑處理不一樣響應

實際中的路徑確定是沒有.html這樣的,他們大概是這樣:node

var http = require('http')

var server = http.createServer()

server.on('request', function (req, res) {
    
    //一、經過req.url拿到當前請求路徑
    var url = req.url
    //2.根據不一樣的請求路徑處理不一樣的響應
    if(url === '/') {
        res.end('index page')
    }else if(url ==='/login') {
        res.end('login page')
    }else if(url === '/register'){
        res.end('resgister page')
    }else {
        res.end('404 Not Found')
    }
    
})
server.listen(3000, function(){
    console.log('running...');
})

瀏覽器輸入http://localhost:3000/register http://localhost:3000 http://localhost:3000/login 到達不一樣的頁面git

var http = require('http');
var fs = require('fs');

var server = http.createServer(function(req, res) {
    console.log('request was made: ' + req.url);

    if (req.url === '/home' || req.url === '/'){

        res.writeHead(200,{'Content-Type': 'text/html'});
      fs.createReadStream(__dirname + '/index.html','utf8').pipe(res);
      
    }else  if(req.url === '/contact'){
  res.writeHead(200,{'Content-Type': 'text/html'});
  fs.createReadStream(__dirname + '/contact.html','utf8').pipe(res);
        
    }else  if(req.url === '/api/users'){
        var users = [{name: 'AlexZ33', age:26}, {name: 'jingxin', age: 8}];

        res.writeHead(200, {'Content-Type': 'application/json'});
        res.end(JSON.stringify(users));

    }else {
    res.writeHead(404,{'Content-Type': 'text/html'});
  fs.createReadStream(__dirname + '/404.html','utf8').pipe(res);
    }
    
});

server.listen(3000,'127.0.0.1');
console.log('now listening to port 3000');

圖片描述

因此咱們開啓服務器 瀏覽器輸入 http://localhost:3000/home 或者 http://localhost:3000 都會訪問到index.html頁面github

圖片描述

瀏覽器輸入 http://localhost:3000/contactweb

圖片描述

}else  if(req.url === '/api/users'){
    var users = [{name: 'AlexZ33', age:26}, {name: 'jingxin', age: 8}];

    res.writeHead(200, {'Content-Type': 'application/json'});
    res.end(JSON.stringify(users));
}

這段的json字符串 在實際的app中 你獲得的應該來自數據庫(database)數據庫

咱們在瀏覽器中輸入一個不存在的路徑 好比 http://localhost:3000/77express

圖片描述

處理靜態資源
路徑本質上就是標識,這裏有一個小項目關於實現的靜態資源訪問頁面路徑設置
戳這裏npm

MVC

RESTful

REST API

圖片描述

5分鐘構建一個Restful後端
REST與RESTFul API最佳實踐json

相關文章
相關標籤/搜索