ExpressのEJSテンプレートエンジンでエラーが発生する

NodeJSを学習しましたが、テンプレートエンジンとしてEJSを使用しています。しかし、registerボタンをクリックするたびに登録ページが表示されます。title is not definedというエラーが表示されています。ここに私のコードです。ExpressのEJSテンプレートエンジンでエラーが発生する

users.js

var express = require('express'); 
var router = express.Router(); 
var multer = require('multer'); 
var uploads = multer({dest: './uploads'}); 

/* GET users listing. */ 
router.get('/', function(req, res, next) { 
    res.send('respond with a resource'); 
}); 

router.get('/register', function(req, res, next) { 
    res.render('register',{ 
    'title': 'Register' 
    }); 
}); 

router.get('/login', function(req, res, next) { 
    res.render('login',{ 
    'title': 'Login' 
    }); 
}); 

router.post('/register', uploads.single('profileImage'), function(req, res, next){ 
    var name = req.body.name; 
    var email = req.body.email; 
    var username = req.body.username; 
    var password = req.body.password; 
    var password2 = req.body.password2; 


    //Check for image field 

    if(req.file){ 
     console.log('Uploading file.....'); 

     var profileImageOriginalName = req.files.profileimage.originalname; 
     var profileImageName = req.files.profileimage.name; 
     var profileImageMime = req.files.profileimage.mimetype; 
     var profileImagePath = req.files.profileimage.path; 
     var profileImageExt = req.files.profileimage.extension; 
     var profileImageSize = req.files.profileimage.size; 
    } 
    else{ 
     //set a default image 
     var profileImageName = 'noimage.png'; 
    } 

    //Form Validation 
    req.checkBody('name','This field is required').notEmpty(); 
    req.checkBody('email','This field is required').notEmpty(); 
    req.checkBody('email','Invalid Email').isEmail(); 
    req.checkBody('username','This field is required').notEmpty(); 
    req.checkBody('password','This field is required').notEmpty(); 
    req.checkBody('password2','Passwords do not match').equals(req.body.password); 

    //check for errors 
    var errors = req.validationErrors(); 
    if(errors){ 
     res.render('register',{ 
      errors: errors, 
      name: name, 
      email: email, 
      username: username, 
      password: password, 
      password2: password2 
     }); 
    } 
    else{ 
     var newUser = new User({ 
      name: name, 
      email: email, 
      username: username, 
      password: password, 
      profileimage: profileImageName 
     }); 
     //Create user 
     /*User.createUser(newUser, function(err, user){ 
      if(err) throw err; 
      console.log(user);  
     });*/ 

     //success message 
     req.flash('success', 'Your account registered successfully'); 
     res.location('/'); 
     res.redirect('/'); 
    } 
}); 

module.exports = router;

head.ejs

<title><%= title %></title> 
<link rel='stylesheet' href='/stylesheets/bootstrap.css' /> 
<link rel='stylesheet' href='/stylesheets/style.css' />

header.ejs

<nav class="navbar navbar-inverse navbar-fixed-top"> 
    <div class="container"> 
    <div class="navbar-header"> 
     <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> 
     <span class="sr-only">Toggle navigation</span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     <span class="icon-bar"></span> 
     </button> 
     <a class="navbar-brand" href="#">Project name</a> 
    </div> 
    <div id="navbar" class="collapse navbar-collapse"> 
     <ul class="nav navbar-nav"> 
     <li <% if (title == "Members") { %>class="active" <% } %> ><a href="/">Members</a></li> 
     <li <% if (title == "Register") { %>class="active" <% } %> ><a href="https://stackoverflow.com/users/register">Register</a></li> 
     <li <% if (title == "Login") { %>class="active" <% } %> ><a href="https://stackoverflow.com/users/login">Log In</a></li> 
     </ul> 
     <ul class="nav navbar-nav navbar-right"> 
     <li><a href="https://stackoverflow.com/users/logout">Log Out</a></li> 
     </ul> 
    </div><!--/.nav-collapse --> 
    </div> 
</nav>

register.ejs

<!DOCTYPE html> 
<html> 
    <head> 
    <% include ./partials/head.ejs %> 
    </head> 
    <body> 

    <div class="container"> 
     <% include ./partials/header.ejs %> 
     <h1>Register</h1> 
     <p>Please Register using the below form</p> 
     <form method="post" action="https://stackoverflow.com/users/register" enctype="multipart/form-data"> 
     <div class="form-group"> 
      <label>Name</label> 
      <input class="form-control" type="text" name="name" placeholder="Enter your name"> 
     </div> 
     <div class="form-group"> 
      <label>Email</label> 
      <input class="form-control" type="email" name="email" placeholder="Enter your email"> 
     </div> 
     <div class="form-group"> 
      <label>Username</label> 
      <input class="form-control" type="text" name="username" placeholder="Enter your username"> 
     </div> 
     <div class="form-group"> 
      <label>Password</label> 
      <input class="form-control" type="password" name="password" placeholder="Enter your Password"> 
     </div> 
     <div class="form-group"> 
      <label>Confirm Password</label> 
      <input class="form-control" type="password" name="password2" placeholder="Confirm your Password"> 
     </div> 
     <div class="form-group"> 
      <label>Profile Image</label> 
      <input class="form-control" type="file" name="profileImage"> 
     </div> 
     <button class="btn btn-default" name="submit" type="submit" value="Register">Register</button> 
     </form> 
    </div> 
    </body> 
    <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script> 
    <script type="text/javascript" src="/javascript/bootstrap.js"></script> 
</html>

なぜこれが起こっている私はなっておりません。私はthis solutionを試しましたが、動作しません。どんな助けもありがとう。

出典

2016-10-02 Sinscary

リクエストが/にヒットしたときに、ルータがリダイレクトする場所を正確に理解できませんでした。

router.get('/', function(req, res, next) { 
    res.send('respond with a resource'); 
});

は通常 /ことが indexテンプレートにリダイレクトします。 EJSを使用すると、たとえば、テンプレートにリダイレクトできます。

router.get('/', function(req, res, next) { 
    res.render('index', {param: value}); 
});

何が起こっているように見えることはあなたの要求が/に当たったとき、それはそれに送られtitleパラメータを必要とするhead.ejsが含まれたテンプレートにリダイレクトするということです。得るためにあなたのルートで

、あなたはこれを正しく送信します

router.get('/register', function(req, res, next) { 
    res.render('register',{ 
     'title': 'Register' 
    }); 
});

しかし、あなたの要求は、POSTメソッドを打ったとき、すべてのロジックの後、あなたは、テンプレートにリダイレクトされません。あなたはリダイレクトしているがそれは/に、パラメータはありません。経路がテンプレートhead.ejsを使用してアクセスする場合、このエラーが発生します。あなたのケースでは

、たとえindex.ejsにか、私は、次のように、（代わりにres.location('/');とres.redirect('/');の）EJSテンプレートをレンダリングするためにrender方法でそれを呼び出します（例えば）messageUserAdded.ejsにあなたのリダイレクト：

res.render('index', {title: 'User Successfully Added'});

さらに、可能性を追加するには、成功したメッセージ用のテンプレートを作成してから、メッセージを渡して、各ページにカスタマイズしたものを適切に作成します。例として、このようなテンプレート：

が成功しました。その後、EJS

<html> 
    <head><title> <%=title%> </title></head> 
<body> 
    <h1>This works!</h1> 
    <h2> <%=messageTitle%> </h2> 
    <span> <%=messageDetails%> </span> 
</body> 
</html>

そして、あなたのPOSTでそれを使用します。

// After all the logic 
res.render('successfulMessage', { 
    title: 'Success', 
    messageTitle: 'Account Created', 
    messageDetails: 'John has been added to our database!' 
})

はそれを解決するのに役立ちます願っています。

出典

2016-10-02 12:52:39 Tom

'res.location'の代わりに' res.render'を試しましたが、まだ同じエラー – Sinscary

res.render（ 'yourTemplate'、{title： 'あなたのタイトル'}）を使いましたか？あなたの質問にリダイレクトするテンプレートを追加できますか？また、res.sendへのルートを保持しましたか（'resource with resource '）？ – Tom

私は 'res.render（ 'index'、{title： 'Members'}'）を入れました。 – Sinscary

ExpressのEJSテンプレートエンジンでエラーが発生する

答えて

関連する問題