博客,Contents,目,錄,項(xiàng)目環(huán)境搭建項(xiàng)目功能實(shí)現(xiàn)項(xiàng)目包含的知識(shí)點(diǎn),1.項(xiàng)目環(huán)境搭建,1.1項(xiàng)目介紹,多人博客管理系統(tǒng),博客內(nèi)容展示博客管理功能,1.項(xiàng)目環(huán)境搭建,1.2案例初始化,1.建立項(xiàng)目所需文件夾public靜態(tài)資源model數(shù)據(jù)庫操作route路由views模板2.初始化項(xiàng)目描述文件npminit-y3.下載項(xiàng)目所需第三方模塊npminstallexpressmongooseart-templateexpress-art-template4.創(chuàng)建網(wǎng)站服務(wù)器,1.項(xiàng)目環(huán)境搭建,1.2案例初始化,5.構(gòu)建模塊化路由6.構(gòu)建博客管理頁面模板,2.項(xiàng)目功能實(shí)現(xiàn),2.1登錄,1.創(chuàng)建用戶集合，初始化用戶連接數(shù)據(jù)庫創(chuàng)建用戶集合初始化用戶2.為登錄表單項(xiàng)設(shè)置請(qǐng)求地址、請(qǐng)求方式以及表單項(xiàng)name屬性3.當(dāng)用戶點(diǎn)擊登錄按鈕時(shí)，客戶端驗(yàn)證用戶是否填寫了登錄表單4.如果其中一項(xiàng)沒有輸入，阻止表單提交5.服務(wù)器端接收請(qǐng)求參數(shù)，驗(yàn)證用戶是否填寫了登錄表單6.如果其中一項(xiàng)沒有輸入，為客戶端做出響應(yīng)，阻止程序向下執(zhí)行,2.項(xiàng)目功能實(shí)現(xiàn),2.1登錄,7.根據(jù)郵箱地址查詢用戶信息8.如果用戶不存在，為客戶端做出響應(yīng)，阻止程序向下執(zhí)行9.如果用戶存在，將用戶名和密碼進(jìn)行比對(duì)10.比對(duì)成功，用戶登錄成功11.比對(duì)失敗，用戶登錄失敗12.保存登錄狀態(tài),13.密碼加密處理,2.項(xiàng)目功能實(shí)現(xiàn),2.2新增用戶,1.為用戶列表頁面的新增用戶按鈕添加鏈接2.添加一個(gè)連接對(duì)應(yīng)的路由，在路由處理函數(shù)中渲染新增用戶模板3.為新增用戶表單指定請(qǐng)求地址、請(qǐng)求方式、為表單項(xiàng)添加name屬性4.增加實(shí)現(xiàn)添加用戶的功能路由5.接收到客戶端傳遞過來的請(qǐng)求參數(shù)6.對(duì)請(qǐng)求參數(shù)的格式進(jìn)行驗(yàn)證7.驗(yàn)證當(dāng)前要注冊(cè)的郵箱地址是否已經(jīng)注冊(cè)過8.對(duì)密碼進(jìn)行加密處理9.將用戶信息添加到數(shù)據(jù)庫中10.重定向頁面到用戶列表頁面,2.項(xiàng)目功能實(shí)現(xiàn),2.3數(shù)據(jù)分頁,當(dāng)數(shù)據(jù)庫中的數(shù)據(jù)非常多是，數(shù)據(jù)需要分批次顯示，這時(shí)就需要用到數(shù)據(jù)分頁功能。,分頁功能核心要素：,總頁數(shù)：Math.ceil（總數(shù)據(jù)條數(shù)/每頁顯示數(shù)據(jù)條數(shù)）,當(dāng)前頁，用戶通過點(diǎn)擊上一頁或者下一頁或者頁碼產(chǎn)生，客戶端通過get參數(shù)方式傳遞到服務(wù)器端總頁數(shù)，根據(jù)總頁數(shù)判斷當(dāng)前頁是否為最后一頁，根據(jù)判斷結(jié)果做響應(yīng)操作,2.項(xiàng)目功能實(shí)現(xiàn),2.3數(shù)據(jù)分頁,limit(2)/limit限制查詢數(shù)量傳入每頁顯示的數(shù)據(jù)數(shù)量skip(1)/skip跳過多少條數(shù)據(jù)傳入顯示數(shù)據(jù)的開始位置,數(shù)據(jù)開始查詢位置=（當(dāng)前頁-1）*每頁顯示的數(shù)據(jù)條數(shù),2.項(xiàng)目功能實(shí)現(xiàn),2.4用戶信息修改,1.將要修改的用戶ID傳遞到服務(wù)器端2.建立用戶信息修改功能對(duì)應(yīng)的路由3.接收客戶端表單傳遞過來的請(qǐng)求參數(shù)4.根據(jù)id查詢用戶信息，并將客戶端傳遞過來的密碼和數(shù)據(jù)庫中的密碼進(jìn)行比對(duì)5.如果比對(duì)失敗，對(duì)客戶端做出響應(yīng)6.如果密碼對(duì)比成功，將用戶信息更新到數(shù)據(jù)庫中,2.項(xiàng)目功能實(shí)現(xiàn),2.5用戶信息刪除,1.在確認(rèn)刪除框中添加隱藏域用以存儲(chǔ)要?jiǎng)h除用戶的ID值2.為刪除按鈕添自定義屬性用以存儲(chǔ)要?jiǎng)h除用戶的ID值3.為刪除按鈕添加點(diǎn)擊事件，在點(diǎn)擊事件處理函數(shù)中獲取自定義屬性中存儲(chǔ)的ID值并將ID值存儲(chǔ)在表單的隱藏域中4.為刪除表單添加提交地址以及提交方式5.在服務(wù)器端建立刪除功能路由6.接收客戶端傳遞過來的id參數(shù)7.根據(jù)id刪除用戶,2.項(xiàng)目功能實(shí)現(xiàn),2.6開發(fā)環(huán)境與生產(chǎn)環(huán)境,環(huán)境，就是指項(xiàng)目運(yùn)行的地方，當(dāng)項(xiàng)目處于開發(fā)階段，項(xiàng)目運(yùn)行在開發(fā)人員的電腦上，項(xiàng)目所處的環(huán)境就是開發(fā)環(huán)境。當(dāng)項(xiàng)目開發(fā)完成以后，要將項(xiàng)目放到真實(shí)的網(wǎng)站服務(wù)器電腦中運(yùn)行，項(xiàng)目所處的環(huán)境就是生產(chǎn)環(huán)境。,什么是開發(fā)環(huán)境與生產(chǎn)環(huán)境,因?yàn)樵诓煌沫h(huán)境中，項(xiàng)目的配置是不一樣的，需要在項(xiàng)目代碼中判斷當(dāng)前項(xiàng)目運(yùn)行的環(huán)境，根據(jù)不同的環(huán)境應(yīng)用不同的項(xiàng)目配置。,為什么要區(qū)分開發(fā)環(huán)境與生產(chǎn)環(huán)境,2.項(xiàng)目功能實(shí)現(xiàn),2.6開發(fā)環(huán)境與生產(chǎn)環(huán)境,通過電腦操作系統(tǒng)中的系統(tǒng)環(huán)境變量區(qū)分當(dāng)前是開發(fā)環(huán)境還是生產(chǎn)環(huán)境。,如何區(qū)分開發(fā)環(huán)境與生產(chǎn)環(huán)境,2.項(xiàng)目功能實(shí)現(xiàn),2.6開發(fā)環(huán)境與生產(chǎn)環(huán)境,如何區(qū)分開發(fā)環(huán)境與生產(chǎn)環(huán)境,if(process.env.NODE_ENV=development)/開發(fā)環(huán)境else/生產(chǎn)環(huán)境,2.項(xiàng)目功能實(shí)現(xiàn),2.7第三方模塊config,作用：允許開發(fā)人員將不同運(yùn)行環(huán)境下的應(yīng)用配置信息抽離到單獨(dú)的文件中，模塊內(nèi)部自動(dòng)判斷當(dāng)前應(yīng)用的運(yùn)行環(huán)境，并讀取對(duì)應(yīng)的配置信息，極大提供應(yīng)用配置信息的維護(hù)成本，避免了當(dāng)運(yùn)行環(huán)境重復(fù)的多次切換時(shí)，手動(dòng)到項(xiàng)目代碼中修改配置信息,使用步驟,使用npminstallconfig命令下載模塊在項(xiàng)目的根目錄下新建config文件夾在config文件夾下面新建default.json、development.json、production.json文件在項(xiàng)目中通過require方法，將模塊進(jìn)行導(dǎo)入使用模塊內(nèi)部提供的get方法獲取配置信息,2.項(xiàng)目功能實(shí)現(xiàn),2.7第三方模塊config,將敏感配置信息存儲(chǔ)在環(huán)境變量中,在config文件夾中建立custom-environment-variables.json文件配置項(xiàng)屬性的值填寫系統(tǒng)環(huán)境變量的名字項(xiàng)目運(yùn)行時(shí)config模塊查找系統(tǒng)環(huán)境變量，并讀取其值作為當(dāng)前配置項(xiàng)屬于的值,db:pwd:APP_PWD,2.項(xiàng)目功能實(shí)現(xiàn),2.8文章評(píng)論,創(chuàng)建評(píng)論集合判斷用戶是否登錄，如果用戶登錄，再允許用戶提交評(píng)論表單在服務(wù)器端創(chuàng)建文章評(píng)論功能對(duì)應(yīng)的路由在路由請(qǐng)求處理函數(shù)中接收客戶端傳遞過來的評(píng)論信息將評(píng)論信息存儲(chǔ)在評(píng)論集合中將頁面重定向回文章詳情頁面在文章詳情頁面路由中獲取文章評(píng)論信息并展示在頁面中,3.項(xiàng)目包含的知識(shí)點(diǎn),3.1密碼加密bcrypt,/導(dǎo)入bcrypt模塊constbcrypt=require(bcrypt);/生成隨機(jī)字符串gen=generate生成salt鹽letsalt=awaitbcrypt.genSalt(10);/使用隨機(jī)字符串對(duì)密碼進(jìn)行加密letpass=awaitbcrypt.hash(明文密碼,salt);,哈希加密是單程加密方式：1234=abcd在加密的密碼中加入隨機(jī)字符串可以增加密碼被破解的難度。,/密碼比對(duì)letisEqual=pare(明文密碼,加密密碼);,3.項(xiàng)目包含的知識(shí)點(diǎn),3.1密碼加密bcrypt,bcrypt依賴的其他環(huán)境1.python2.x2.node-gypnpminstall-gnode-gyp3.windows-build-toolsnpminstall-global-productionwindows-build-tools,3.項(xiàng)目包含的知識(shí)點(diǎn),3.2cookie與session,cookie：瀏覽器在電腦硬盤中開辟的一塊空間，主要供服務(wù)器端存儲(chǔ)數(shù)據(jù)。cookie中的數(shù)據(jù)是以域名的形式進(jìn)行區(qū)分的。cookie中的數(shù)據(jù)是有過期時(shí)間的，超過時(shí)間數(shù)據(jù)會(huì)被瀏覽器自動(dòng)刪除。cookie中的數(shù)據(jù)會(huì)隨著請(qǐng)求被自動(dòng)發(fā)送到服務(wù)器端。,請(qǐng)求,響應(yīng)cookie,請(qǐng)求cookie,session：實(shí)際上就是一個(gè)對(duì)象，存儲(chǔ)在服務(wù)器端的內(nèi)存中，在session對(duì)象中也可以存儲(chǔ)多條數(shù)據(jù)，每一條數(shù)據(jù)都有一個(gè)sessionid做為唯一標(biāo)識(shí)。,3.項(xiàng)目包含的知識(shí)點(diǎn),3.2cookie與session,郵件地址、密碼,驗(yàn)證請(qǐng)求參數(shù),生成sessionId,將sessionId存儲(chǔ)在客戶端的cookie中,cookie,獲取cookie中的sessionId，驗(yàn)明身份,響應(yīng)只有用戶登陸后才能獲取的數(shù)據(jù),3.項(xiàng)目包含的知識(shí)點(diǎn),在node.js中需要借助express-session實(shí)現(xiàn)session功能。,3.2cookie與session,constsession=require(express-session);app.use(session(secret:secretkey);,3.項(xiàng)目包含的知識(shí)點(diǎn),JavaScript對(duì)象的規(guī)則描述語言和驗(yàn)證器。,3.3Joi,constJoi=require(joi);constschema=username:Joi.string().alphanum().min(3).max(30).required().error(newError(錯(cuò)誤信息),password:Joi.string().regex(/a-zA-Z0-93,30$/),access_token:Joi.string(),Joi.number(),birthyear:Joi.number().integer().min(1900).max(2013),email:Joi.string().email();Joi.validate(username:abc,birthyear:1994,schema);,3.項(xiàng)目包含的知識(shí)點(diǎn),作用：解析表單，支持get請(qǐng)求參數(shù)，post請(qǐng)求參數(shù)、文件上傳。,3.4formidable,/引入formidable模塊constformidable=require(formidable);/創(chuàng)建表單解析對(duì)象constform=newformidable.IncomingForm();/設(shè)置文件上傳路徑form.uploadDir=/my/dir;/是否保留表單上傳文件的擴(kuò)展名form.keepExtensions=false;/對(duì)表單進(jìn)行解析form.parse(req,(err,fields,files)=/fields存儲(chǔ)普通請(qǐng)求參數(shù)/files存儲(chǔ)上傳的文件信息);,3.項(xiàng)目包含的知識(shí)點(diǎn),3.5文件讀取FileReader,varreader=newFileReader();reader.readAsDataURL(文件);reader.onload=function()console.log(reader.result);,data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9InllcyI/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTQwIiBoZWlnaHQ9IjE0MCIgdmlld0JveD0iMCAwIDE0MCAxNDAiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjwhLS0KU291cmNlIFVSTDogaG9sZGVyLmpzLzE0MHgxNDAKQ3JlYXRlZCB3aXRoIEhvbGRlci5qcyAyLjYuMC4KTGVhcm4gbW9yZSBhdCBodHRwOi8vaG9sZGVyanMuY29tCihjKSAyMDEyLTIwMTUgSXZhbiBNYWxvcGluc2t5IC0gaHR0cDovL2ltc2t5LmNvCi0tPjxkZWZzPjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+PCFbQ0RBVE,3.項(xiàng)目包含的知識(shí)點(diǎn),3.6數(shù)據(jù)分頁mongoose-sex-page,constpagination=require(mongoose-sex-page);pagination(集合構(gòu)造函數(shù)).page(1).size(20).display(8).exec();,3.項(xiàng)目包含的知識(shí)點(diǎn),3.7mongoDB數(shù)據(jù)庫添加賬號(hào),1.以系統(tǒng)管理員的方式運(yùn)行powershell2.連接數(shù)據(jù)庫mongo3.查看數(shù)據(jù)庫showdbs4.切換到admin數(shù)據(jù)庫useadmin5.創(chuàng)建超級(jí)管理員賬戶db.createUser()6.切換到blog數(shù)據(jù)useblog7.創(chuàng)建普通賬號(hào)db.createUser()8.卸載mongodb服務(wù)1.停止服務(wù)netstopmongodb2.mongod-remove,