Node.js中用到的第三方框架(經常使用、持續更新)

第三方框架

一、art-template使用

安裝
sudo npm i art-template
複製代碼

命令在哪執行,就會把包下載到哪裏,默認會下載到node_modules目錄中javascript

node_modules不要改,不支持改html

在瀏覽器中簡單的使用art-template
<body>
	<!-- 在瀏覽器中須要引用lib/template-web.js -->
	<script src="node_modules/art-template/lib/template-web.js"></script>
	<script type="text/template" id="tpl">
		hello {{name}}
	</script>
	<script>
		var ret=template('tpl',{
			name:'Jack'
		})
		console.log(ret)
	</script>
複製代碼

模板引擎不關心字符串內容,只關心本身能認識的模板標記語法,例如{{}}java

{{}}語法被稱之爲mustache語法,八字鬍語法node

在node中使用模板引擎

模板引擎最先是誕生在服務端mysql

使用步驟
  1. 安裝sudo npm install art-templateweb

  2. 在須要使用的文件模塊中加載art-templatesql

    只須要使用require方法加載就能夠了,參數中的art-template就是下載的包的名字mongodb

  3. 查文檔使用模板引擎的APIshell

var template=require('art-template')
複製代碼

例子數據庫

var template=require('art-template');

var ret=template.render('hello {{ name }}',{
	name: 'Jack'
})

console.log(ret)
複製代碼
數據類型

默認讀取到的data是二進制數據

而模板引擎的render方法須要接收的是字符串

因此須要把data二進制數據抓呢日字符串才能夠給模板引擎使用

第三方模板引擎

在node中,有不少第三方模板引擎均可以使用,不是隻有art-template

ejs、jade(pug)、handlebars、nunjucks

art-template中的include-extend-block語法
include引入界面公共部分

引入公共頭部和尾部

<body>
	{{include './header.html'}}
		
	{{include './footer.html'}}
</body>
複製代碼
模板繼承

layout.html

<body>
	{{include './header.html'}}
		//留一個坑,將要留給孩子去填坑
		
		{{ block 'content'}}
			<h1>默認內容</h1>
		
		{{/block}}
	{{include './footer.html'}}
</body>
複製代碼

index.html

{{extend './layout.html'}}

//填坑語法(如果index頁面沒有,則會顯示layout頁面的默認內容)
{{block 'content'}}
	<div>
		<h1>index頁面填坑內容</h1>
	</div>
{{ /block }}
複製代碼

孩子也有本身的樣式

好比樣式和js代碼

一樣能夠在對應的位置留坑

{{ block 'head'}}{{/block}}

{{ block 'script'}}{{/block}}
複製代碼

二、Express

第三方web開發框架,高度封裝了http模塊

更加專一於業務,而非底層細節

原生的http在某些方面表現不足以應對咱們的開發需求,因此須要使用框架來加快開發效率

框架的目的就是提升效率,讓咱們的代碼更高度統一

在node中有不少web開發框架,Express只是其中之一

起步

安裝
npm install --save express
複製代碼
hello world
const express=require('express')
const app=express()

app.get('/',(req,res)=>res.send('hello world!'))

app.listen(3000,()=>console.log('Example app listening on port 3000!'))
複製代碼
基本路由

路由(router):路由其實就是一張表,這個表中有具體的映射關係

  • 請求方法
  • 請求路徑
  • 請求處理函數

get:

當你以GET方法請求/的時候,執行對應的處理函數
app.get('/',function(req,res){
	res.send('Hello World!')
})
複製代碼

post:

當以post方法請求/的時候,指定對應的處理函數
app.post('/',function(req,res)){
	res.send('Got a POST request')
}
複製代碼
靜態服務
app.use(express.static('public'))
app.use(express.static('files'))

app.use('/static',express.static('public'))

app.use('/static',express.static(path.join(__dirname,'public')))
複製代碼

在Express中使用art-template

安裝:

npm install --save art-template
npm install --save express-art-template
複製代碼

配置與使用:

var express=require('express')
var app=express()

app.use('/public/',express.static('./public/'))
//也能夠這樣寫  app.use('/public/',express.static('public'))
//開發public資源夾,能夠直接訪問public文件夾中的文件



//配置使用art-template模板引擎
//第一個參數,表示當渲染以art結尾的文件的時候使用art-template模板引擎
//express-art-template是專門用來在express中把art-template整合到express中
//雖然外面這裏不須要記載art-template可是也必須安裝
//緣由就在於express-art-template依賴了art-template

app.engine('art',require('express-art-template'))

//express爲response響應對象提供一個方法render
//render方法默認是不可用的。可是若是配置了模板引擎就可使用
//res.render('html模板名',{模板數據})
//第一個參數不能寫路徑,默認回去項目中的views目錄中查找該模板文件
//Express有一個約定:開發人員把全部的視圖文件html都放到views目錄中

app.set('views',render函數的默認路徑)
//若是要修改默認的views目錄,則可使用set方法
複製代碼
使用模板函數的get方法
app.get('/error',function(req,res){
	res.render('404.art',{
		title:'測試'
	})
})
使用res.send方法
app.get('/post',function(req,res){
	res.send('post page')
})

設置端口
app.listen(3000,function(){
	console.log('running...')
})
複製代碼

views文件夾名稱:視圖渲染存儲目錄

在Express獲取get請求參數

express內置了一個API能夠直接經過req.query來獲取

req.query
複製代碼
在Express獲取post表單請求體

在這裏須要使用一個第三方包:body-parser

安裝:

npm install --save body-parser
複製代碼

配置:

0引包
var bodyParser=require('body-parser')

配置body-parser
只要加入這個配置,則在req請求對象上會多出一個屬性:body
也就是說能夠直接經過req.body來獲取表單POST請求體數據了

app.use(bodyParser.urlencoded({extended:false}))
app.use(bodyParser.json())
複製代碼

使用:

app.use(function(req,res){
	res.setHeader('Content-Type','text/plain')
	res.write('you posted:\n')
	能夠經過req.body來獲取表單POST請求體數據
	res.end(JSON.stringify(req.body,null,2))
})
複製代碼
將路由模塊從入口模塊分離出來

方法一:

不是很方便可是須要了解

主要利用了模塊系統,實際上之間將方法傳遞

在app.js入口模塊中

var express=require('express')
var router=require('./router.js')

var app=express()

router(app)
複製代碼

在router.js路由模塊中

module.exports=function(app){
	app.get('/students/new',function(req,res){

	})
}
複製代碼

方法二:

Express中提供了一種更好的方式專門用來包裝路由

路由模塊 router.js 中

//加載express模塊
var express=require('express')

//建立一個路由容器
var router=express.Router()

//把路由都掛載到router路由容器中
router.get('/students',function(req,res){

})

//最後再把router導出來
module.exports=router	
複製代碼

在入口模塊app.js中

var router=require('./router.js')

app.use(router)
複製代碼
json方法

Express提供了一個響應方法json方法,能夠把對象轉成字符串send出去

接收一個對象做爲參數

res.status(200).json({
	success:true,
	foo:'bar'
})
複製代碼
Express對於沒有設定的路徑請求

默認會返回Can not get XXX

若是想要定製404

須要經過中間件來配置

只須要在本身的路由以後增長一個

app.use(function(req,res)){
//全部未處理的請求路徑都會跑到這裏
//404
}
複製代碼

三、nodemon第三方命令行工具

可使用一個第三方命名行工具:nodemon來幫咱們解決頻繁修改代碼重啓服務器問題

nodemon是一個基於Node.js開發的一個第三方命令行工具,咱們使用的時候須要獨立安裝

#在任意目錄執行該命令均可以

npm install --global nodemon
複製代碼

安裝完畢以後,使用:

node app.js

#使用nodemon
nodemon app.js
複製代碼

只要是經過nodemon app.js啓動的服務,則它會監事你的文件變化,當文件發生變化的時候,自動幫你重啓服務器

四、express-session

Express框架中使用express-session插件

Express這個框架中,默認不支持Session和Cookie

可是可使用第三方中間件:express-session來解決

  • npm install express-session
  • 配置(必定要在app.use(router)以前
  • 使用
    • 當把這個插件配置好以後,就能夠經過req.session來訪問和設置Session成員
    • 添加Session數據:req.session.foo='bar'
    • 訪問Session數據:req.session.foo
app.use(session({
	secret:'itcast',       //配置加密字符串,會在原有加密基礎之上和這個字符串拼起來去加密,目的是爲了增長安全性,防止客戶端惡意僞造
	resave:false,
	//不管是否使用session都默認給你一個鑰匙
	saveUninitialized:true
}))
複製代碼

提示:默認session數據時內存存儲的,服務器一旦重啓就會丟失,真正的生產環境會把session進行持久化存儲(能夠存儲到數據庫中,有對應的插件)

MongoDB

關係型數據庫和非關係型數據庫

表就是關係

表與表之間存在關係

  • 全部的關係型數據庫都須要經過sql語言來操做
  • 全部的關係型數據庫在操做以前都須要設計表結構
  • 並且數據表還支持約束
    • 惟一的
    • 主鍵
    • 默認值
    • 非空
  • 非關係型詩句庫很是的靈活
  • 有的非關係型數據庫就是key-value對
  • 可是MongoDB是長的最像關係型數據庫的非關係型數據庫
    • 數據庫 -》數據庫
    • 數據表-》集合(數組)
    • 表記錄-》(文檔對象)
  • MongoDB不須要設計表結構,很是靈活
  • 能夠任意的往裏面存數據,沒有結構性這麼一說

啓動:

mongod
複製代碼

修改默認的數據存儲目錄,能夠:

mongod --dbpath=數據存儲目錄路徑
複製代碼

中止:

直接ctrl+c
關閉服務檯
複製代碼

鏈接和退出:

mongo //默認鏈接本機的mongoDB服務

exit	//在鏈接狀態輸入退出
複製代碼
MongoDB macbook記錄

由於macbook默認的根目錄更新之後就變成只讀狀態,因此直接啓動 輸入mongod啓動服務的方式是沒法啓動,須要在後面接着更改後的存儲位置,因此啓動命令就變成了 mongod --dbpath 指定的文件存放路徑

基本命令
  • show dbs
    • 查看顯示全部數據庫
  • db
    • 查看當前操做的數據庫
  • use 數據庫名稱
    • 切換到指定的數據庫(若是沒有會新建)
  • 插入數據
在node中操做MongoDB
  • 可使用官方的mongodb包來操做
  • 使用第三方mongoose來操做

小例子:

var mongoose=require('mongoose')
mongoose.connect('mongodb://localhost/test')


// 表名,({文檔:類型})
var Cat=mongoose.model('Cat',{name:String})

var kitty=new Cat({name : 'Zac'})


// 持久化保存
kitty.save(function(err){
	if (err) {
		console.log(err)
	}else{
		console.log('meow')
	}
})

複製代碼

基本概念

  • 數據庫(能夠有多個)
  • 集合(能夠有多個集合collection,mysql中是表,MongoDB中是數組)
  • 文檔 --> {}
  • 文檔解構很靈活沒有限制
  • MongoDB很是靈活,不須要向MySQL同樣先建立數據庫,表,設計表結構
    • 在這裏只須要:當你須要插入數據的時候,只須要指定往哪一個數據庫的哪一個集合操做就能夠
    • 一切都有MongoDB來幫你自動完成建庫表這件事
{
	qq:{
		users:[
			{name:'張三',age:15},
			{},{}
		],
		products:[
		
		]
	},
	tabao:{
	
	},
	jingdong:{
	
	}
}
複製代碼

操做指南

設計Schema發佈model
//鏈接表數據庫

var mongoose=require('mongoose')

var Schema=mongoose.Schema

// test能夠改爲不存在的數據庫會自動建立
mongoose.connect('mongod://localhost/testdb');

// 設計集合結構(表結構)
// 字段名稱就是表結構中的屬性名稱
// 值
// 約束的目的是爲了保證數據的完整性,不要有髒數據
// var blogSchema=new Schema({
// 	title: String,
// 	author: String,
// 	body:String,
// 	comments:[{body:String,date:Date}],
// 	date:{type:Date,default:Date.now},
// 	hidden:Boolean,
// 	meta: {
// 		votes:Number,
// 		favs:Number
// 	}
// })

var userSchema =new Schema({
	userName:{
		type:String,
		required:true //必須有
	},
	password:{
		type:String,
		required:true //必須有
	},
	email:{
		type:String
	}
})

// 將文檔結構發佈爲模型
// mongoose.model 方法就是用來將一個架構發佈爲model
// 	第一個參數:傳入一個大寫名詞單數字符串用來表示你的數據庫名稱
// 	例如 User 會變成 users
// 	第二個參數:架構 Schema
// 	返回值:模型構造函數
var User=mongoose.model('User',userSchema)
複製代碼
增長數據
var admin=new User({
	username:'admin',
	password:'123456',
	email:'admin@admin.com'
})

admin.save(function(err,ret){
	if (err) {
		console.log('保存失敗')
	}else {
		console.log('保存成功')
	}
})
複製代碼
查詢全部

第一個參數可選知足的全部

User.find(function(err,ret){
	if (err) {
		console.log('查詢失敗')
	}else {
		console.log(ret)
	}
})
複製代碼
查詢一個

第一個參數爲參照條件

User.findOne({
	username:'zs'
},function(err,ret){
	if (err) {
		console.log('查詢失敗')
	}else {
		console.log(ret)
	}
})
複製代碼
刪除知足條件的
User.remove({
	username:'zs'
},function(err,ret){
	if (err) {
		console.log('刪除失敗')
	}else {
		console.log('刪除成功')
		console.log(ret)
	}
})
複製代碼
更新數據
Tank.findByIdAndUpdate(id, { $set: { size: 'large' }}, { new: true }, function (err, tank) {
  if (err) return handleError(err);
  res.send(tank);
});
複製代碼

根據條件刪除一個(remove 和 update也是同樣的操做):

Model.findOneAndRemove(condition,[option],[callback])
複製代碼

根據id刪除一個:

Model.findByIdAndRemove(id,[option],[callback])
複製代碼
相關文章
相關標籤/搜索