前提・実現したいこと
ExpressとEJSを使って、現在Webアプリのログイン画面を作成しています。
サーバー側のjsファイルでチェックした結果をEJSに吐き出したいのですが、
以下の様に、<%=errorMsg%>という記述を記載すると、
定義されてない旨のエラーが出てしまい、何がいけないのか解らず、苦戦しています。
発生している問題・エラーメッセージ
ReferenceError: .....\Sample\views\createAccount.ejs:22 20| <h1>アカウント登録</h1> 21| </div> >> 22| <div id="errMsgArea"><p><%=errorMsg%></p></div> 23| <div class="contents"> 24| <form action="/check/checkCreateAccount/submit" method="post"> 25| <div class="inputGroup"> errorMsg is not defined at eval (.....\Sample\views\createAccount.ejs:12:25) at createAccount (.....\Sample\node_modules\ejs\lib\ejs.js:691:17) at tryHandleCache (.....\Sample\node_modules\ejs\lib\ejs.js:272:36) at View.exports.renderFile [as engine] (.....\Sample\node_modules\ejs\lib\ejs.js:489:10) at View.render (.....\Sample\node_modules\express\lib\view.js:135:8) at tryRender (.....\Sample\node_modules\express\lib\application.js:640:10) at Function.render (.....\Sample\node_modules\express\lib\application.js:592:3) at ServerResponse.render (.....\Sample\node_modules\express\lib\response.js:1012:7) at .....\Sample\router.js:11:7 at Layer.handle [as handle_request] (.....\Sample\node_modules\express\lib\router\layer.js:95:5)
該当のソースコード
■ createAccount.ejs
<!DOCTYPE html> <html> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> <title>アカウント登録画面</title> <script src="https://code.jquery.com/jquery-1.11.1.js"></script> <link rel="stylesheet" href="/css/createAccount.css" /> </head> <script> </script> <body> <div class="header"> <img src="/image/serviceLogo.png" alt="" /> </div> <div class="container"> <div class="heading"> <h1>アカウント登録</h1> </div> <div id="errMsgArea"><p><%=errorMsg%></p></div> <div class="contents"> <form action="/check/checkCreateAccount/submit" method="post"> <div class="inputGroup"> <p>ログインID</p> <input type="text" size="25" name="userID" /> <p>新パスワード</p> <input type="password" size="25" name="password" /> <p>パスワード変更</p> <input type="password" size="25" name="chkPassword" /> </div> <div class="btnGroup"> <input type="submit" class="button" value="登録する" /> </div> </form> </div> </div> </body> </html>
■ checkCreateAccount.js
const express = require('express'); const router = express.Router({mergeParams: true}); let errMsg = ""; // MySQL接続 const connection = require('../connectionDB.js'); var bodyParser = require('body-parser'); router.use(express.urlencoded({extended: false})); // アカウント登録画面のチェック router.post('/submit', (req, res) => { // パスワードの整合性チェック if (req.body.password !== req.body.chkPassword){ errMsg = "パスワードとパスワード(変更)が一致していません。" }; if (errMsg === ""){ connection.query( "select * from users where id = ?", [req.body.userID], (error, results) => { if(results.length > 0) { errMsg = "ログインIDは既に使用されています。" } console.log("エラー" + errMsg); } ); } // アカウント作成画面 res.render('createAccount.ejs', {errorMsg: errMsg}); }); module.exports = router;
フォルダ階層
SAMPLE
├── check
│ ├── checkCreateAccount.js
│
├── views
│ ├── createAccount.ejs
│
├── public
│ ├── ・・・
│
├── app.js
├── connectionDB.js
├── package-lock.json
├── package.json
├── router.js
├── connectionDB.js
使用している環境
node v15.4.0
npm 7.0.15
ejs 3.1.5
express 4.17.1
コメント
投稿が初めてなので、情報不足かもしれないので、ご指摘いただければ修正致します。
よろしくお願い致します。
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。