目次
認証戦略
パスポート戦略の使用
ログイン戦略
登録戦略
ログアウト機能の実装
ルートの保護
結論
ホームページ ウェブフロントエンド jsチュートリアル パスポートを使用したNode.jsアプリケーションを認証します

パスポートを使用したNode.jsアプリケーションを認証します

Mar 13, 2025 am 10:54 AM

このチュートリアルでは、node.jsアプリケーションをゼロから開発し、人気のある認証ミドルウェアパスポートを使用して、認証の懸念を処理します。

Passportのドキュメントでは、「ノード用のシンプルで目立たない認証ミドルウェア」と説明しています。

Passportは、ミドルウェアとして自分自身を提供することで、Webアプリケーションの他の懸念を認証ニーズから分離するのに優れた仕事をします。ロギング、ボディパルシング、クッキーパルシング、セッション処理など、他のエクスプレスミドルウェアを構成するのと同じように、パスポートをエクスプレスベースのWebアプリケーションに簡単に構成できます。

このチュートリアルでは、node.jsの基本的な理解と、認証に焦点を合わせるためのExpressフレームワークを想定していますが、サンプルExpressアプリをゼロから作成しています。ルートを追加し、それらのルートの一部を認証することにより、アプリを保護します。

認証戦略

Passportは、500の認証メカニズムから選択できます。ローカルまたはリモートのデータベースインスタンスに対して認証するか、Facebook、Twitter、GoogleなどのOAuthプロバイダーを使用して単一のサインオンを使用して、ソーシャルメディアアカウントで認証できます。

ただし、心配しないでください。アプリケーションでは不要な戦略を含める必要はありません。これらの戦略はすべて互いに独立しており、パスポートのミドルウェア:NPMインストールExpressをインストールするときにデフォルトで含まれていない個別のノードモジュールとしてパッケージ化されています。

次のコードスニペットで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(function(user、done){<br> console.log( 'Serializing user:'、user);<br> done(null、user._id);<br> });<br><br> passport.deserializeUser(function(id、done){<br> user.findbyid(id、function(err、user){<br> console.log( 'Deserializing user:'、user);<br> done(err、user);<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 = function(user、password){<br> bcrypt.comparesync(password、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とその仕組みの詳細については、ドキュメントをご覧ください。

次に、アプリケーションの次の4つのビューを作成します。

  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> link(rel = 'styleSheet'、href = '/styleSheets/style.css')<br> link(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-offset-4<br> h1.text-center.login-titleパスポートアプリにサインインします<br> Div.Account-Wall<br> img(class = 'profile-img'、src = 'https://lh5.googleusercontent.com/-b0-k99fzlye/aaaaaaaaaai/aaaaaaaaaaaa/eu7opa4byxi/photo.jpg?sz = 120')<br> form(class = 'form-signin'、action = '/login'、method = 'post')<br> input(type = 'text'、name = 'username' class = 'form-control'、placeholder = 'email'、必須、オートフォーカス)<br> 入力(type = 'password'、name = 'password' class = 'form-control'、placeholder = 'password'、必須)<br> button(class = 'btn btn-lg btn-primary btn-block'、type = 'submit')サインイン<br> span.clearfix<br> a(href = '/signup'、class = 'text-center new-account')アカウントを作成します<br> #メッセージ<br> メッセージの場合<br> h1.text-center.error-message#{message}<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-offset-4<br> h1.text-center.login-title登録の詳細<br> div.signup-wall<br> form(class = 'form-signin'、action = '/signup'、method = 'post')<br> input(type = 'text'、name = 'username'、class = 'form-control'、placeholder = 'username'、必須、オートフォーカス)<br> 入力(type = 'password'、name = 'password'、class = 'form-control nomargin'、placeholder = 'password'、必須)<br> 入力(type = 'email'、name = 'email'、class = 'form-control'、placeholder = 'email'、必須)<br> input(type = 'text'、name = 'firstName'、class = 'form-control'、placeholder = 'first name'、必須)<br> input(type = 'text'、name = 'lastName'、class = 'form-control'、placeholder = 'last name'、必須)<br> button(class = 'btn btn-lg btn-primary btn-block'、type = 'submit')レジスタ<br> span.clearfix<br> #メッセージ<br> メッセージの場合<br> h1.text-center.error-message#{message}<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-offset-4<br> #ユーザー<br> h1.text-center.login-title welcome#{user.firstname}。以下の詳細を確認してください。<br> div.signup-wall<br> UL.USER-Details<br> li username --->#{user.username}<br> liメール--->#{user.email}<br> li名--->#{user.firstname}<br> liの姓--->#{user.lastname}<br> a(href = '/signout'、class = 'text-center 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( '/signout'、function(req、res、next){<br> req.logout(function(err){<br> if(err){return next(err); }<br> res.redirect( '/')<br> })<br> });<br>
ログイン後にコピー

ルートの保護

また、パスポートは、匿名のユーザーに適さないと思われるルートへのアクセスを保護する機能を提供します。これは、ユーザーがアプリケーションで認証せずにhttp:// localhost:3000/homeにアクセスしようとする場合、ホームページにリダイレクトされることを意味します。

 / *ホームページを取得 */<br> router.get( '/home'、isauthenticated、function(req、res){<br> Res.Render( 'Home'、{user:req.user});<br> });<br><br> //他のミドルウェアと同様に、next()を呼び出すことは典型的です<br>//ユーザーが認証されている場合<br>var isauthenticated = function(req、res、next){<br> if(req.isauthenticated())<br> next();<br> res.redirect( '/');<br> }<br>
ログイン後にコピー

結論

Node.jsアプリケーションの認証に関しては、この分野で唯一のプレーヤーではありませんが、モジュール性、柔軟性、コミュニティサポート、そしてそれが単なるミドルウェアであるという事実がパスポートを最大限に選択するという事実です。

PassportとEverauthの詳細な比較のために、Passport自身の開発者からの興味深い有益な視点を以下に示します。

GitHubリポジトリの例の完全なソースコードを見つけることができます。

node.jsで他に何ができるかを確認したい場合は、レスポンシブAJAX連絡フォームからURLショートナー、またはデータベースCRUDジェネレーターまで、Envato Marketのnode.jsアイテムの範囲をチェックしてください。

この投稿は、メアリー・オコスンからの貢献により更新されました。メアリーは、ナイジェリアのラゴスに拠点を置くソフトウェア開発者であり、node.js、JavaScript、MySQL、およびNOSQLテクノロジーの専門知識を持っています。

以上がパスポートを使用したNode.jsアプリケーションを認証しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

Video Face Swap

Video Face Swap

完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

Python vs. JavaScript:学習曲線と使いやすさ Python vs. JavaScript:学習曲線と使いやすさ Apr 16, 2025 am 12:12 AM

Pythonは、スムーズな学習曲線と簡潔な構文を備えた初心者により適しています。 JavaScriptは、急な学習曲線と柔軟な構文を備えたフロントエンド開発に適しています。 1。Python構文は直感的で、データサイエンスやバックエンド開発に適しています。 2。JavaScriptは柔軟で、フロントエンドおよびサーバー側のプログラミングで広く使用されています。

JavaScriptとWeb:コア機能とユースケース JavaScriptとWeb:コア機能とユースケース Apr 18, 2025 am 12:19 AM

Web開発におけるJavaScriptの主な用途には、クライアントの相互作用、フォーム検証、非同期通信が含まれます。 1)DOM操作による動的なコンテンツの更新とユーザーインタラクション。 2)ユーザーエクスペリエンスを改善するためにデータを提出する前に、クライアントの検証が実行されます。 3)サーバーとのリフレッシュレス通信は、AJAXテクノロジーを通じて達成されます。

JavaScript in Action:実際の例とプロジェクト JavaScript in Action:実際の例とプロジェクト Apr 19, 2025 am 12:13 AM

現実世界でのJavaScriptのアプリケーションには、フロントエンドとバックエンドの開発が含まれます。 1)DOM操作とイベント処理を含むTODOリストアプリケーションを構築して、フロントエンドアプリケーションを表示します。 2)node.jsを介してRestfulapiを構築し、バックエンドアプリケーションをデモンストレーションします。

JavaScriptエンジンの理解:実装の詳細 JavaScriptエンジンの理解:実装の詳細 Apr 17, 2025 am 12:05 AM

JavaScriptエンジンが内部的にどのように機能するかを理解することは、開発者にとってより効率的なコードの作成とパフォーマンスのボトルネックと最適化戦略の理解に役立つためです。 1)エンジンのワークフローには、3つの段階が含まれます。解析、コンパイル、実行。 2)実行プロセス中、エンジンはインラインキャッシュや非表示クラスなどの動的最適化を実行します。 3)ベストプラクティスには、グローバル変数の避け、ループの最適化、constとletsの使用、閉鎖の過度の使用の回避が含まれます。

Python vs. JavaScript:開発環境とツール Python vs. JavaScript:開発環境とツール Apr 26, 2025 am 12:09 AM

開発環境におけるPythonとJavaScriptの両方の選択が重要です。 1)Pythonの開発環境には、Pycharm、Jupyternotebook、Anacondaが含まれます。これらは、データサイエンスと迅速なプロトタイピングに適しています。 2)JavaScriptの開発環境には、フロントエンドおよびバックエンド開発に適したnode.js、vscode、およびwebpackが含まれます。プロジェクトのニーズに応じて適切なツールを選択すると、開発効率とプロジェクトの成功率が向上する可能性があります。

JavaScript通訳者とコンパイラにおけるC/Cの役割 JavaScript通訳者とコンパイラにおけるC/Cの役割 Apr 20, 2025 am 12:01 AM

CとCは、主に通訳者とJITコンパイラを実装するために使用されるJavaScriptエンジンで重要な役割を果たします。 1)cは、JavaScriptソースコードを解析し、抽象的な構文ツリーを生成するために使用されます。 2)Cは、Bytecodeの生成と実行を担当します。 3)Cは、JITコンパイラを実装し、実行時にホットスポットコードを最適化およびコンパイルし、JavaScriptの実行効率を大幅に改善します。

Python vs. JavaScript:ユースケースとアプリケーションと比較されます Python vs. JavaScript:ユースケースとアプリケーションと比較されます Apr 21, 2025 am 12:01 AM

Pythonはデータサイエンスと自動化により適していますが、JavaScriptはフロントエンドとフルスタックの開発により適しています。 1. Pythonは、データ処理とモデリングのためにNumpyやPandasなどのライブラリを使用して、データサイエンスと機械学習でうまく機能します。 2。Pythonは、自動化とスクリプトにおいて簡潔で効率的です。 3. JavaScriptはフロントエンド開発に不可欠であり、動的なWebページと単一ページアプリケーションの構築に使用されます。 4. JavaScriptは、node.jsを通じてバックエンド開発において役割を果たし、フルスタック開発をサポートします。

Webサイトからアプリまで:JavaScriptの多様なアプリケーション Webサイトからアプリまで:JavaScriptの多様なアプリケーション Apr 22, 2025 am 12:02 AM

JavaScriptは、Webサイト、モバイルアプリケーション、デスクトップアプリケーション、サーバー側のプログラミングで広く使用されています。 1)Webサイト開発では、JavaScriptはHTMLおよびCSSと一緒にDOMを運用して、JQueryやReactなどのフレームワークをサポートします。 2)ReactNativeおよびIonicを通じて、JavaScriptはクロスプラットフォームモバイルアプリケーションを開発するために使用されます。 3)電子フレームワークにより、JavaScriptはデスクトップアプリケーションを構築できます。 4)node.jsを使用すると、JavaScriptがサーバー側で実行され、高い並行リクエストをサポートします。

See all articles