ホームページ ウェブフロントエンド jsチュートリアル ログイン登録機能コードの実装(Node.js+Express+MongoDB)

ログイン登録機能コードの実装(Node.js+Express+MongoDB)

May 02, 2017 am 10:04 AM

この記事では主に Node+Express+MongoDB のログインと登録機能を紹介しますので、必要な方は参考にしてください

MongoDB の依存関係を注入します


var mongoose = require("mongoose");
ログイン後にコピー

フォーム処理が必要なため、bodyParser ミドルウェアは必要です

bodyParser モジュールはファイル解析を行い、フォーム内のデータをフォーマットします


var bodyParser = require("body-parser"); 
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));
ログイン後にコピー

ログイン後にユーザー情報を保存するには、cookieParser ミドルウェアに依存するセッションミドルウェアを使用する必要があります


var cookieParser = require('cookie-parser');
var session = require('express-session');
ar mongoStore = require('connect-mongo')(session);
var dbUrl = 'mongodb://localhost/express';
app.use(cookieParser()); 
app.use(session({
 secret:'express',
 store: new mongoStore({
 url: dbUrl,
 collection: 'sessions'
 })
}));
ログイン後にコピー

jade を使用しますテンプレート

ルーティングの設定


登録ページにログイン


doctype html
html
 head
  meta(charset='utf-8')
  title #{title}
  include ./includes/head
 body
  include ./includes/header
  block content
ログイン後にコピー

登録機能


link(href='css/main.css', rel='stylesheet')
link(href="/libs/bootstrap/dist/css/bootstrap.min.css" rel="external nofollow" , rel="stylesheet")
script(src="/libs/jquery/dist/jquery.min.js")
script(src="/libs/bootstrap/dist/js/bootstrap.min.js")
ログイン後にコピー

ログイン機能

.container
 .row
  .page-header
   h1 #{title}
.navbar.navbar-default.navbar-fixed-bottom
 .container
  if user
   p.navbar-text.navbar-right
    span 欢迎你,#{user.name}
    span  | 
    a.navbar-link(href="/layout" rel="external nofollow" ) 退出登录
  else
   p.navbar-text.navbar-right
    a.navbar-link(href="/signup" rel="external nofollow" , data-toggle="modal", data-target="#signupModal") 注册
    span  | 
    a.navbar-link(href="/login" rel="external nofollow" , data-toggle="modal", data-target="#signinModal") 登录
ログイン後にコピー

ログアウト


include ../layout
 block content
  form.form-horizontal( role="form", method="POST", action='/user/signup')
   .form-group
    label.col-sm-2.control-label(for="signupName") 用户名
    .col-sm-10
     input#signupName.form-control(type="text", name="user[name]", placeholder="输入用户名")
   .form-group
    label.col-sm-2.control-label(for="signuppassword") 密码
    .col-sm-10
     input#signuppassword.form-control(type="password", name="user[password]", placeholder="输入密码")
   .form-group
    label.col-sm-2.control-label(for="signupemail") 邮箱
    .col-sm-10
     input#signupemail.form-control(type="email", name="user[email]", placeholder="输入邮箱")
   .form-group
    .col-sm-offset-2.col-sm-10
     button.btn.btn-default(type="submit") 完成注册
ログイン後にコピー

登録されたデータベース操作

データベースに接続

// 注册页面
app.get('/signup', function (req,res) {
 res.render('signup', {
 title: '注册'
 });
});
// 登录页面
app.get('/login', function (req,res) {
 res.render('login', {
 title: '登录'
 });
});
ログイン後にコピー

スキーマ定義

データの更新と検索、およびパスワードソルティング

// 注册表单
app.post('/user/signup', function (req,res) {
 var _user = req.body.user;
 User.findOne({name:_user.name}, function (err, user) {
 if(err){
  console.log(err);
 }
 if(user) {
  return res.redirect('/login');
 } else {
  var user = new User(_user);
  user.save(function (err, user) {
  if(err){
   console.log(err);
   res.redirect('/signup');
  }
  console.log('注册成功——用户名:' + user);
  res.redirect('/login'); 
  });
 }
 });
});
ログイン後にコピー

rrreええモデルコンピレーションモデル

// 登录表单
app.post('/user/login', function (req,res) {
 var _user = req.body.user;
 var name = _user.name;
 var password = _user.password;
 User.findOne({name:name}, function (err, user) {
 if(err){
  console.log(err);
 }
 if(!user) {
  return res.redirect('/signup');
 }
 user.comparePassword(password, function (err, isMatch) {
  if (err){
  console.log(err);
  }
  if (isMatch) {
  req.session.user = user; // 用户名存入session中
  console.log('登录成功——用户名: ' + user);
  return res.redirect('/');
  } else {
  return res.redirect('/lgoin');
  }
 });
 });
});
ログイン後にコピー


エントリファイルインジェクション

app.get('/layout', function(req,res){
 delete req.session.user;
 //delete app.locals.user; // 删除全局变量user,否则点击退出登录,页面无变化
 res.redirect('/');
});
ログイン後にコピー

認証ミドルウェア


は、セッションのユーザー名を取得し、それをローカルに保存し、ビューに公開します。つまり、ユーザーを取得できますheader.jade内。


りー

以上がログイン登録機能コードの実装(Node.js+Express+MongoDB)の詳細内容です。詳細については、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衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

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

SublimeText3 中国語版

SublimeText3 中国語版

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

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

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

mongodb ではどのバージョンが一般的に使用されますか? mongodb ではどのバージョンが一般的に使用されますか? Apr 07, 2024 pm 05:48 PM

最新の機能と改善が提供される MongoDB の最新バージョン (現在 5.0) を使用することをお勧めします。バージョンを選択するときは、機能要件、互換性、安定性、コミュニティ サポートを考慮する必要があります。たとえば、最新バージョンにはトランザクションや集計パイプラインの最適化などの機能が備わっています。バージョンがアプリケーションと互換性があることを確認してください。運用環境の場合は、長期サポート バージョンを選択してください。最新バージョンでは、より積極的なコミュニティサポートが提供されています。

Nodejsとvuejsの違い Nodejsとvuejsの違い Apr 21, 2024 am 04:17 AM

Node.js はサーバー側の JavaScript ランタイムであり、Vue.js は対話型ユーザー インターフェイスを作成するためのクライアント側の JavaScript フレームワークです。 Node.js はバックエンド サービス API 開発やデータ処理などのサーバー側開発に使用され、Vue.js はシングルページ アプリケーションや応答性の高いユーザー インターフェイスなどのクライアント側開発に使用されます。

mongodb によって作成されたデータベースはどこにありますか? mongodb によって作成されたデータベースはどこにありますか? Apr 07, 2024 pm 05:39 PM

MongoDB データベースのデータは、ローカル ファイル システム、ネットワーク ファイル システム、またはクラウド ストレージに配置できる指定されたデータ ディレクトリに保存されます。具体的な場所は次のとおりです: ローカル ファイル システム: デフォルトのパスは Linux/macOS: /data/db、Windows: C:\data\db。ネットワーク ファイル システム: パスはファイル システムによって異なります。クラウド ストレージ: パスはクラウド ストレージ プロバイダーによって決定されます。

mongodbデータベースの利点は何ですか mongodbデータベースの利点は何ですか Apr 07, 2024 pm 05:21 PM

MongoDB データベースは、その柔軟性、スケーラビリティ、および高いパフォーマンスで知られています。その利点には、データを柔軟かつ非構造化された方法で保存できるドキュメント データ モデルが含まれます。シャーディングによる複数サーバーへの水平スケーラビリティ。クエリの柔軟性により、複雑なクエリと集計操作をサポートします。データ レプリケーションとフォールト トレランスにより、データの冗長性と高可用性が確保されます。 JSON サポートにより、フロントエンド アプリケーションと簡単に統合できます。大量のデータを処理する場合でも高速な応答を実現する高いパフォーマンス。オープンソースでカスタマイズ可能で無料で使用できます。

mongodb とはどういう意味ですか? mongodb とはどういう意味ですか? Apr 07, 2024 pm 05:57 PM

MongoDB は、大量の構造化データと非構造化データを保存および管理するために使用されるドキュメント指向の分散データベース システムです。その中心的な概念にはドキュメントのストレージと配布が含まれ、その主な機能には動的スキーマ、インデックス作成、集約、マップリデュース、レプリケーションが含まれます。コンテンツ管理システム、電子商取引プラットフォーム、ソーシャル メディア Web サイト、IoT アプリケーション、モバイル アプリケーション開発で広く使用されています。

mongodbを開く方法 mongodbを開く方法 Apr 07, 2024 pm 06:15 PM

Linux/macOS の場合: データ ディレクトリを作成し、「mongod」サービスを開始します。 Windows の場合: データ ディレクトリを作成し、Service Manager から MongoDB サービスを開始します。 Docker の場合: 「docker run」コマンドを実行します。他のプラットフォームの場合: MongoDB のドキュメントを参照してください。確認方法: 「mongo」コマンドを実行して接続し、サーバーのバージョンを確認します。

mongodb データベース ファイルはどこにありますか? mongodb データベース ファイルはどこにありますか? Apr 07, 2024 pm 05:42 PM

MongoDB データベース ファイルは、MongoDB データ ディレクトリにあります。デフォルトでは /data/db です。このディレクトリには、.bson (ドキュメント データ)、ns (コレクション情報)、journal (書き込み操作レコード)、wiredTiger (WiredTiger 使用時のデータ) が含まれています。ストレージ エンジン ) および config (データベース構成情報) およびその他のファイル。

navicat の有効期限が切れた場合の対処方法 navicat の有効期限が切れた場合の対処方法 Apr 23, 2024 pm 12:12 PM

Navicat の有効期限の問題を解決するには、ライセンスを更新する、自動更新を無効にする、Navicat プレミアム エッセンシャルの無料バージョンを使用する、などがあります。

See all articles