SailsJSで簡単なブログを書く:初心者向けのグッドプラクティス(部2)

あらすじ







前に、ブログの基本の書き方を学びましたが、基本を書きながら、静的の編成、モデルのコンパイル、コントローラーコードの記述に精通しました。 パス構成( routes.js )の操作方法、およびSailsJSのビューの操作方法を学びました。 SailsJSで簡単なブログを書くことについての第2部では、次の点について説明します。ユーザー:作成。 セッション:作成(入力)、中断(終了)。 管理パネルを作成し、ポリシーとアクセス制限を操作します。





ユーザー



新しいAPIコンプレックスを作成するために、プロジェクトのルートで既に知っているチームを紹介します。

sails generate api user
      
      





今回は、コードを整理するときにパスワードを暗号化する必要があります。このため、このタスクに適した優れたパスワードハッシュモジュールが必要です。 プロジェクトをインストールするには、プロジェクトのルートで次のコマンドを入力します

 npm install password-hash --save
      
      





--saveパラメーターは、 パッケージの値をpackage.jsonの依存関係として保存することを示します。



以前の投稿で、SailsJSでモデルとコントローラーを操作する基本的なスキルを既に調べました。それらがどこにあり、どのように正しく構成するかについては、すでに明らかなことに注意を払いません。



モデル


ユーザーにはいくつかの属性があります。

  1. ユーザー名
  2. パスワード
  3. 管理者-アクセスパラメータ


モデルをコンパイルするとき、サーバーでパスワード暗号化を行い、モデルのライフサイクルの操作に基づいていくつかの追加の補助機能を作成することも忘れないでください

 var passwordHash = require('password-hash'); var User = { attributes: { username: {type: 'string', required: true, unique: true}, password: {type: 'string', required: true, minLength: 8}, admin: { type: 'boolean', defaultsTo: false }, toJSON: function() { var element = this.toObject(); delete element.password; return element; } }, beforeCreate: function (values, next) { //       var mainPass = passwordHash.generate(values.password); values.encryptPassword = mainPass; next(); } }; module.exports = User;
      
      





新しいユーザーを作成する前に、暗号化されたバージョンのパスワードであるencryptedPasswordという追加の属性を追加します。



コントローラー


コントローラーでは、ユーザーとインデックスページの作成のみを可能にします。 ユーザーの更新ハンドラーと削除ハンドラーを作成する方法は、ポストコントローラーで行ったことと同じように自分で行うことができます。 これがコントローラーのコードです。

 module.exports = { //@API -   /** *   , *     *  , ,   *  .   *    *  .    *     * admin (api/policies/admin.js)   *       *    */ create: function (req, res) { var elem = { username : req.param('username'), password : req.param('password'), admin : req.param('admin') }; User.create(elem).exec(function (err, user) { if (err) return res.send(500); req.session.auth = true; res.redirect('/'); }); }, // @MAIN index: function (req, res) { res.view(); } };
      
      





パス構成( config / routes.js )に以下を追加します。

  '/register' : 'UserController',
      
      





簡単な保護として、構成ファイル( config / csrf.js )でCSRF保護を有効にし、次のように行を編集します

 module.exports.csrf = true;
      
      







ビュー( ビュー/ユーザー/ index.ejs


次に、プレゼンテーションを作成しましょう。最もシンプルな構造になります。

 <div class="container"> <div class="row"> <div class="col-md-4"></div> <div class="col-md-4"> <div class="panel panel-default"> <div class="panel-body"> <form action="/user/create" method="post"> <input type="text" name="username" placeholder=" "><br> <input type="password" name="password" placeholder=""><br> <input type="hidden" name="_csrf" value="<%= _csrf %>"> <!--        --> <input type="hidden" name="admin" value="true"> <input type="submit" class="btn btn-success btn-block" value=""> </form> </div> </div> </div> <div class="col-md-4"></div> </div> </div>
      
      





または、表示する代わりに、csrfを無効にして、たとえばPostmanを使用してユーザーを作成することもできます。 そして、ユーザーコントローラーをブロックします。



これで、ユーザーを作成するためのコンポーネントの作成が完了しました。 これで、モデル、コントローラー、登録ページのパス、およびプレゼンテーションテンプレートが作成されました。



セッション



ユーザーを認証するには、Sailsに組み込まれたセッションシステムを使用します。これは便利で非常に安全で(Cookieと比較した場合)、セッションコントローラーはセッションを作成して破棄できます。 標準的な方法で新しいコントローラーを作成します。 これがコントローラーのコードです。

 var passwordHash = require('password-hash'); module.exports = { // @API    create: function (req, res) { /** *    * ,     *   */ var username = req.param('username'), password = req.param('password'); /** *        *  ,    * (.     *  ,   flash) */ if (!username || !password) { return res.redirect('/session'); }; /** *      * (username - req.param('username')) *     *      *    ,   * ,     - *   ,     *     .  *       *      *    ( ) */ User.findOneByUsername(username).exec(function (err, user) { if (!user || err) return res.send(500); if (passwordHash.verify(password, user.encryptPassword)) { //     //      //    req.session.auth = true; req.session.User = user; if (req.session.User.admin) { return res.redirect('/admin'); }; }; }); }, /** *      *     *  ,    */ destroy: function (req, res) { User.findOne(req.session.User.id).exec(function (err, user) { if (user) { req.session.destroy(); res.redirect('/'); } else { res.redirect('/login'); }; }); }, // @MAIN index: function (req, res) { res.view(); } };
      
      







パス構成


  '/login' : 'SessionController', '/logout' : { controller: 'session', action: 'destroy' },
      
      







提出


そしてログインページビュー

 <div class="container"> <div class="row"> <div class="col-md-4"></div> <div class="col-md-4 text-center"> <h2>Sign-in form</h2><hr> <form action="/session/create" method="POST"> <input type="text" name="username" placeholder="Username" class="form-control" /><br> <input type="password" name="password" placeholder="password" class="form-control" /><br> <input type="submit" class="btn btn-default" value="Log-In" /> <input type="hidden" name="_csrf" value="<%= _csrf %>" /> </form> </div> <div class="col-md-4"></div> </div> </div>
      
      





セッションを登録および作成する機能を作成しました(システムにログインします)。管理パネルページを作成し、アクセス制御ポリシーを構成します。 そして最終段階。



管理パネルと権利の差別化





投稿のリストで構成される最も簡単な管理ページと、新しい投稿を追加するためのフォームがあります。 既存の投稿を編集するためのページもあります。 次に、新しい管理コントローラーを作成します。 これがコントローラーのコードです。

 module.exports = { index: function (req, res) { Post.find() .sort('id DESC') .exec(function (err, posts) { if (err) return res.send(500); res.view({ posts: posts }); }); }, edit: function (req, res) { var Id = req.param('id'); Post.findOne(Id).exec(function (err, post) { if (!post) return res.send(404); if (err) return res.send(500); res.view({ post: post }); }); } };
      
      





そして、提出物の2つ。



ビュー/ admin / index.ejs


 <div class="container text-center"> <h2>CREATE NEW</h2><br> <div class="row"> <form action="/post/create" method="POST"> <div class="col-md-6"> <input class="form-control" type="text" name="title" placeholder="Title Post"><hr> <textarea rows="3" class="form-control" name="description" placeholder="Description"></textarea> </div> <div class="col-md-6"> <textarea rows="7" class="form-control" name="content" placeholder="Content"></textarea> </div> <div class="col-md-12"> <input type="hidden" name="_csrf" value="<%= _csrf %>" /> <br><input type="submit" class="btn btn-success" value="CREATE" /> </div> </form> </div><br> <h2>POST LIST</h2> <table class="table text-left"> <tr> <th>ID</th> <th>TITLE</th> <th></th> <th></th> <th></th> </tr> <% _.each(posts, function (post) { %> <tr> <td><%= post.id %></td> <td><%= post.title %></td> <td><a href="/post/watch/<%= post.id %>" class="btn btn-info">Look</a></td> <td><a href="/post/delete/<%= post.id %>" class="btn btn-danger">Delete</a></td> <td><a href="/admin/edit/<%= post.id %>" class="btn btn-warning">Edit</a></td> </tr> <% }) %> </table> </div>
      
      







ビュー/ admin / edit.ejs


 <div class="container"> <div class="row"> <div class="col-md-2"></div> <div class="col-md-8 well text-center"> <form action="/post/update" method="POST"> <h4>Title</h4> <input type="text" class="form-control" name="title" value="<%= post.title %>"><br> <h4>Description</h4> <textarea rows="3" name="description" class="form-control" value="<%= post.description %>"></textarea> <h4>Content</h4> <textarea rows="7" name="content" class="form-control" value="<%= post.content %>"></textarea> <input type="hidden" name="_csrf" value="<%= _csrf %>" /><br> <input type="submit" class="btn btn-success" value="Update"> </form> </div> <div class="col-md-2"></div> </div> </div>
      
      







それでは、ポリシー作成に取りかかりましょう。



政治学


Sailsのアクセス権を制限するシステムは非常に便利で使いやすいです。この場合、ユーザーが次のことを確認するだけで十分です。



これをコードで表現するために、ポリシーファイルapi / policies / admin.jsを作成します。 そして、これがデリミタのコードです。

 module.exports = function (req, res, ok) { if (req.session.auth && req.session.User.admin) { return ok(); } else { return res.redirect('/login'); }; }
      
      





この場合、コールバックは次のアクションをスキップするために戻ります。 結果が反対の場合-無効にし、ログインページにリダイレクトします。 特定のコントローラーでポリシーを有効にするには-config / policies.jsファイルを開き、次の形式でそれをもたらします。

 module.exports.policies = { // Default policy for all controllers and actions // (`true` allows public access) '*': true, /** *     * Admin  admin.js,  *  . */ AdminController: { '*': 'admin' }, UserController: { create: 'admin' }, PostController: { //      index : true, page : true, watch : true, //      create : 'admin', update : 'admin', delete : 'admin', } };
      
      





ここでSailsで簡単なブログを書き終えます。もちろん、機能と保護はほとんどありません。エラー処理(フラッシュメッセージも)はありません。本格的なマルチユーザー管理パネルはありませんが、この記事はこのフレームワークの小さな入門コースとして設計されています。 。 将来的には、機能を増やすために大したことはないはずです。



All Articles