首頁 > web前端 > js教程 > 帶有護照的身份驗證node.js應用程序

帶有護照的身份驗證node.js應用程序

尊渡假赌尊渡假赌尊渡假赌
發布: 2025-03-13 10:54:10
原創
920 人瀏覽過

在本教程中,我們將從Scratch開發一個Node.js應用程序,並使用流行的身份驗證中間件護照來照顧我們的身份驗證問題。

Passport的文檔將其描述為“節點的簡單,不引人注目的身份驗證中間件”,這是正確的。

通過將自己作為中間件提供,Passport在將Web應用程序的其他問題與其身份驗證需求中分離出來,做得非常出色。它可以輕鬆地將護照配置到任何基於Express的Web應用程序中,就像我們配置了其他Express中間件一樣,例如記錄,脫身,餅乾放鬆和會話處理。

該教程對Node.js和Express框架具有基本的了解,以保持對身份驗證的關注,儘管我們確實從頭開始創建一個示例Express應用程序。我們將通過向其添加路線並驗證其中一些路線來保護該應用程序。

身份驗證策略

護照為我們提供了500種身份驗證機制可供選擇。您可以針對本地或遠程數據庫實例進行身份驗證,也可以使用OAUTH提供商進行Facebook,Twitter,Google等使用單個登錄,以使用您的社交媒體帳戶進行身份驗證。

但是請放心:您不需要包括您的應用程序不需要的任何策略。所有這些策略彼此獨立,並作為單獨的節點模塊包裝,這些模塊默認不包含在安裝Passport的中間件時:NPM install Express -Save -Save -Save -Save -Save

您還可以使用以下代碼段安裝Express-Generator:

serializeUser function is used to persist a user's data into the session after successful authentication, while a passport , and create a file init.js with the following code snippets:

 var user = require('../ models/user');<br><br> Module.exports = function(Passport){<br><br> //護照需要能夠序列化和應對用戶的序列化以支持持續的登錄會話<br> Passport.Serializeuser(功能(用戶,完成){<br> console.log('序列化用戶:',用戶);<br> 完成(null,user._id);<br> });<br><br> Passport.Deserializeuser(功能(ID,完成){<br> user.findbyid(id,function(err,用戶){<br> console.log('Queperialization用戶:',用戶);<br> 完成(err,用戶);<br> });<br> });<br> }<br>
登入後複製

使用護照策略

We will now define Passport's strategies for handling login and signup . Each of them would be an instance of the Local Authentication Strategy of Passport and would be created using the npm i connect-flash .

登錄策略

Create a login.js file in the bcryptjs by executing the command passport.use() function.

 var bcrypt = require('bcrypt-nodejs');<br><br> Module.exports = function(Passport){<br><br> Passport.USE('login',...)<br> );<br><br> var Isvalidpassword =函數(用戶,密碼){<br> 返回bcrypt.comparesync(密碼,user.password);<br> }<br> }<br>
登入後複製

如果您對代碼片段感到不安,並且更喜歡查看正在使用的完整代碼,請隨時在此處瀏覽代碼。

註冊策略

Now, we create a signup.js file in the views folder of our application, we should see .jade files. Jade是一種模板引擎,主要用於node.js中的服務器端模板。這是使用Express動態編寫標記和渲染頁面的有力方法。與使用靜態HTML文件相比,它具有更大的靈活性。要了解有關Jade及其工作原理的更多信息,您可以查看文檔。

接下來,我們為應用程序創建以下四個視圖:

  1. layout.jade contains the basic layout and styling information.
  2. index.jade contains the login page providing the login form and giving the option to create a new account.
  3. register.jade contains the registration form.
  4. home.jade says hello and shows the logged-in user's details.
 Doctype HTML<br> html<br> 頭<br> 標題=標題<br> 鏈接(rel ='stylesheet',href ='/stylesheets/style.css')<br> 鏈接(rel ='stylesheet',href ='http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css')<br> 身體<br> 塊內容<br>
登入後複製

In the index.jade file, we will include the following code snippets:

擴展佈局<br><br>塊內容<br> Div.Container<br> Div.Row<br> Div.COL-SM-6.COL-MD-4.COL-MD-FORKSET-4<br> h1.text-center.login-title登錄我們的護照應用<br> Div.Account-Wall<br> img(class='profile-img', src='https://lh5.googleusercontent.com/-b0-k99FZlyE/AAAAAAAAAAI/AAAAAAAAAAA/eu7opA4byxI/photo.jpg?sz=120')<br> form(class ='form-signin',action ='/login',method ='post')<br> 輸入(type ='text',name ='username'class ='form-control',佔位符='email',必需,自動對焦)<br> 輸入(type ='密碼',name ='password'class ='form-control',佔位符='密碼',必需)<br> 按鈕(class ='btn btn-lg btn-primary btn-block',type ='submit')登錄<br> SPAN.CLEARFIX<br> a(href ='/imp.',class ='文本中心new-account')創建一個帳戶<br> #訊息<br> 如果消息<br> h1.text-center.error-message#{messages}<br>
登入後複製

In the register.jade file, we'll include the following code snippets:

擴展佈局<br><br>塊內容<br> Div.Container<br> Div.Row<br> Div.COL-SM-6.COL-MD-4.COL-MD-FORKSET-4<br> h1.text-center.login-title註冊細節<br> Div.Signup-Wall<br> form(class ='form-signin',action ='/imbip',method ='post')<br> 輸入(type ='text',name ='username',class ='form-control',佔位符='用戶名',必需,autococus)<br> 輸入(type ='password',name ='密碼',class ='form-control nomargin',佔位符='密碼',必需)<br> 輸入(type ='email',name ='email',class ='form-control',佔位符='電子郵件',必需)<br> 輸入(type ='text',name ='firstName',class ='form-control',佔位符='名字',必需)<br> 輸入(type ='text',name ='lastname',class ='form-control',佔位符='姓氏',必需)<br> 按鈕(class ='btn btn-lg btn-primary btn-block',type ='submit')註冊<br> SPAN.CLEARFIX<br> #訊息<br> 如果消息<br> h1.text-center.error-message#{messages}<br>
登入後複製

In the home.jade file, we'll include the following code snippets:

擴展佈局<br><br>塊內容<br> Div.Container<br> Div.Row<br> Div.COL-SM-6.COL-MD-4.COL-MD-FORKSET-4<br> #用戶<br> h1.text-center.login-title歡迎#{user.firstname}。在下面查看您的詳細信息:<br> Div.Signup-Wall<br> ul.user-details<br> li用戶名--->#{user.username}<br> 李電子郵件--->#{user.email}<br> 李名字--->#{user.firstname}<br> li姓氏--->#{user.lastname}<br> a(href ='/nignout',class ='文本中心new-account')登錄<br>
登入後複製

現在,註冊頁面看起來像這樣:

帶有護照的身份驗證node.js應用程序

登錄頁面看起來像這樣:

帶有護照的身份驗證node.js應用程序

詳細信息頁面看起來像這樣:

帶有護照的身份驗證node.js應用程序

實現註銷功能

護照是中間件,使得可以根據請求和響應對象添加某些屬性和方法。 Passport has a very handy request.logout() method which invalidates the user session apart from other properties.

因此,很容易定義註銷路線:

 / *處理註銷 */<br> router.get('/nignout',函數(req,res,sext){<br> req.logout(function(err){function(err){<br> if(err){返回next(err); }<br> res.redirect('/')<br> }))<br> });<br>
登入後複製

保護路線

護照還賦予了保護對匿名用戶不適合的路線的訪問的能力。這意味著,如果用戶試圖訪問http:// localhost:3000/home而不在應用程序中進行認證,則將將其重定向到主頁。

 / *獲取主頁 */<br> router.get('/home',iSauthenticated,功能(req,res){<br> res.render('home',{用戶:req.user});<br> });<br><br> //與任何中間件一樣,典型地調用Next()<br> //如果用戶已驗證<br>var isauthentication =函數(req,res,next){<br> if(req.isauthenticated())<br> 返回next();<br> res.redirect('/');<br> }<br>
登入後複製

結論

護照並不是在驗證Node.js應用程序時唯一的參與者,而是模塊化,靈活性,社區支持以及它只是中間件使Passport成為一個不錯的選擇的事實。

有關護照和Everyauth的詳細比較,這是Passport自己的開發人員的有趣且有益的觀點。

您可以在我們的github存儲庫中找到該示例的完整源代碼。

如果您想查看其他可以使用node.js做什麼,請查看Envato市場上的Node.js項目的範圍,從響應式AJAX聯繫表到URL縮短器,甚至是數據庫CRUD GENTATOR。

這篇文章已通過瑪麗·奧科遜(Mary Okosun)的貢獻進行了更新。 Mary是位於尼日利亞拉各斯的軟件開發人員,在Node.js,JavaScript,MySQL和NOSQL Technologies中具有專業知識。

以上是帶有護照的身份驗證node.js應用程序的詳細內容。更多資訊請關注PHP中文網其他相關文章!

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板