[MYSQL]Webアプリケーションの作成-記事の詳細

NodejsとMySqlで簡単なWebアプリケーションを作成しています.前回のリリースでは、データベース内のid値に対応する記事のリストをリストし、id値がない場合、つまりメイン画面にウェルカムメッセージを挿入しました.ただし、リスト項目を動的にクリックした場合、その詳細を出力する機能はまだ実装されていません.そこで、今日実施します.app_mysql.jsは、トピックのid値に基づいて詳細を出力する.app.get(['/topic', '/topic/:id'], function(req, res) { ... }この部分をもう一度見てみましょう.app_mysql.js

app.get(['/topic', '/topic/:id'], function(req, res){
  var sql = 'SELECT id, title FROM topic';
  conn.query(sql, function(err, topics, fields) {
    var id = req.params.id;	
    	res.render('view', {topics:topics});
  });

リストの項目をクリックすると、topicの後ろにid値が付きます.
(JavaScriptをクリックすると、アドレス値はtopic/1になります.)
したがって,id値をパラメータとして取得することが重要である.var id = req.params.id;を追加します.
次にid値がある場合は詳細ビューを出力し、ない場合はviewを画面に表示します.また、詳細ビューはSQLクエリ文で表示されます.以上を実現するコードは以下の通りである.app_mysql.js

app.get(['/topic', '/topic/:id'], function(req, res){
  var sql = 'SELECT id, title FROM topic';
  conn.query(sql, function(err, topics, fields) {
    var id = req.params.id;
    if(id){
      var sql = 'SELECT * FROM topic WHERE id=?';
      conn.query(sql, [id], function(err, topic, fields){
    
      });
    } else {
      res.render('view', {topics:topics});
    }
  });

conn.queryでsqlに接続し、if-else文で詳細ビューを出力するかどうかを区別します.
また,照会'SELECT * FROM topic WHERE id=?';により,患者id=?価格に応じて、conn.query(sql, [id], function(err, topic, fields)ゲートからDBに照会を送信するように行われる.
コールバック関数のパラメータはerrなので、通信エラーが発生した場合の異常処理をコンソールに出力し、ユーザーに「内部サーバエラー」を送信するには、次のようにエンコードします.

        if(err) {
          console.log(err);
          res.status(500).send('Internal Server Error');
        } else {
          res.render('view', {topics:topics, topic:topic[0]});
        }

以上のすべてのコンテンツは、以下のようにコードで実装されています.app_mysql.js

app.get(['/topic', '/topic/:id'], function(req, res){
  var sql = 'SELECT id, title FROM topic';
  conn.query(sql, function(err, topics, fields) {
    var id = req.params.id;
    if(id){
      var sql = 'SELECT * FROM topic WHERE id=?';
      conn.query(sql, [id], function(err, topic, fields){
        if(err) {
          console.log(err);
          res.status(500).send('Internal Server Error');
        } else {
          res.render('view', {topics:topics, topic:topic[0]});
        }
      });
    } else {
      res.render('view', {topics:topics});
    }
  });

今、viewに触れる時だ.view.pug

   article
    if topic
      h2= topic.title
      = topic.description
		div= 'by '+topic.author
    else
      h2 Welcome
      | This is server side javascript tutorials.

上記のトピックのプロパティ値(titleとdescription)を追加することで、タイトルとその説明を出力できます.また,著者情報をDBに入力した.これらの情報をdivラベルの下に出力させます.
今アプリケーションを実行すると...

記事ディレクトリをクリックするたびに、対応する詳細な説明が出力されます.