Где разместить код для отображения данных от MySQL до Handlebars? - PullRequest
0 голосов
/ 12 июля 2020

Цель:

Я стремлюсь научить себя использовать Node JS, MySQL и express.

Я изо всех сил пытаюсь понять где разместить мой код для загрузки данных MySQL в HTML.

Позвольте мне показать вам весь код.

app. js

var express = require('express');

var mysql = require('mysql');
var dotenv = require('dotenv');
var path = require('path');
var cookieParser = require('cookie-parser');

dotenv.config({path: './.env'});


var app = express();

// Connection to MySQL
var db = mysql.createConnection({
  host: process.env.DATABASE_HOST,
  user: process.env.DATABASE_USER,
  password:  process.env.DATABASE_PASSWORD,
  database: process.env.DATABASE
});

db.connect(function(error) {
  if(error) {
    console.log(error);
  }
  else{
    console.log("Connected");
  }
});

// Parse URL-Encoded bodies
app.use(express.urlencoded({extended: false}));
// Parse JSON bodies
app.use(express.json());
// Initialize a cookie
app.use(cookieParser());

// View engine to control HTML
app.set('view engine', 'hbs');

// Public dir
var publicDir = path.join(__dirname, './public');
app.use(express.static(publicDir));

// Define routes
app.use('/', require('./routes/pages'));
app.use('/auth', require('./routes/auth'));

app.listen(3000, function() {
  console.log("Server is running on port 3000");
});

маршрутов / страниц. js

var express = require('express');
var authController = require('../controllers/auth');

var router = express.Router();

// Home
router.get("/", authController.isLoggedIn, function(req,res) {
  res.render("index", {
    user: req.user
  });
});

// Register
router.get("/register", function(req, res) {
  res.render("register");
});

// Login
router.get("/login", function(req, res) {
  res.render("login");
});

// Profile
router.get('/profile', authController.isLoggedIn, function(req, res) {
  if(req.user) {
    res.render('profile', {
      user: req.user
    });
  }
  else {
    res.redirect('login');
  }

});

// Forum
router.get('/forums', authController.isLoggedIn, function(req, res) {
  if(req.user) {
    res.render('forums');
  } else {
    res.redirect('login');
  }
});

// English Division //

// Premier League
router.get('/Leagues/EnglishDivision', authController.isLoggedIn,  function(req, res) {
  if(req.user) {
    res.render('PremierLeague');

  } else {
    res.redirect('../../login');
  }
});


module.exports = router;

маршрутов / аутентификации. js

var express = require('express');
var authController = require('../controllers/auth');

var router = express.Router();

// Register
router.post("/register", authController.register);

// Login
router.post("/login", authController.login);

// Logout
router.get('/logout', authController.logout);

module.exports = router;

контроллеры / аутентификация. js

var mysql = require('mysql');
var jwt = require('jsonwebtoken');
var bcrypt = require('bcryptjs');
var {promisify} = require('util');


// Connection to MySQL
var db = mysql.createConnection({
  host: process.env.DATABASE_HOST,
  user: process.env.DATABASE_USER,
  password:  process.env.DATABASE_PASSWORD,
  database: process.env.DATABASE
});

// Register function
exports.register = function(req, res) {
  console.log(req.body);

  var {name, email, password, passwordConfirm} = req.body;

  db.query("SELECT email FROM users WHERE email = ?", [email], function(error, result) {
    if(error){
      console.log(error);
    }

    if(result.length > 0) {
      return res.render('register', {
        message: 'That email is already in use'
      })
    } else if(password !== passwordConfirm) {
      return res.render('register', {
        message: 'Passwords do not match'
      });
    }

    let hashedPassword = bcrypt.hashSync(password, 8);
    console.log(hashedPassword);

    // Insert user details into MySQL
    db.query('INSERT INTO users set ?', {name: name, email: email, password: hashedPassword, dateJoined: new Date()}, function(error, result) {
      if(error) {
        console.log(error);
      } else {
        console.log(result);
        return res.render('register', {
          message: 'User registered'
        });
      }
    });
  });
}


// Login function

exports.login = function(req, res) {
  try {

    var {email, password} = req.body;

    if(!email || !password) {
      return res.status(400).render('login', {
        message: 'Please provide an email and password'
      });
    }

    db.query('SELECT * FROM users WHERE email = ?', [email], async function(error, result) {

      console.log(result);

      if(!result.length > 0 || !(await bcrypt.compare(password, result[0].password))) {
        res.status(401).render('login', {
          message: 'The email or password is incorrect'
        });
      }


      else {

        var id = result[0].id;

        // Create a token
        var token = jwt.sign({id}, process.env.JWT_SECRET, {
          expiresIn: process.env.JWT_EXPIRES_IN
        });

        console.log("The token is " + token);

        // Create a cookie
        var cookieOptions = {
          expires: new Date(
            Date.now() + process.env.JWT_COOKIE_EXPIRES * 24 * 60 * 60 * 1000
          ),
          httpOnly: true
        }

        // Set up a cookie
        res.cookie('jwt', token, cookieOptions);
        res.status(200).redirect("/");

      }
    });


  } catch (error) {
    console.log(error);
  }
}

// Check if logged in
exports.isLoggedIn = async function(req, res, next) {
  console.log(req.cookies);
  if(req.cookies.jwt){
    try {
      // Verify the token
      var decoded = await promisify(jwt.verify)(req.cookies.jwt, process.env.JWT_SECRET);

      console.log(decoded);

      // Check if user exist
      db.query("SELECT id, name, email, password, date_format(datejoined, '%d/%m/%Y') as dateJoined FROM users WHERE id = ?", [decoded.id], function(error, result) {
        console.log(result);

        // If no result
        if(!result) {
          return next();
        }

        req.user = result[0];
        return next();

      });
    }
  catch (e) {
    console.log(e);
    return next();
  }
} else{
    next();
  }
}

// Logout function
exports.logout = async function(req, res) {
  res.clearCookie('jwt');
  res.status(200).redirect('/');
}

Вопрос

В моем .hbs файле под названием PremierLeague я бы хотел загрузить MySQL данные в формате HTML. Где в приведенном ниже коде мне нужно начать?

Желаемая цель:

Это когда пользователь щелкает в поле просмотра премьер-лиги

введите описание изображения здесь

Каждая запись в MySQL Я бы хотел добавить новую карточку для каждой записи. Я знаю, как использовать HandleBars {{some.data}}.

  • Я просто не понимаю, где кодировать запрос?
  • Должен ли он быть в контроллере или может быть в в router.get(...?
  • Также, как правильно использовать {{#foreach}}?

Ответы [ 2 ]

1 голос
/ 14 июля 2020

Вам не нужен какой-либо другой контроллер c, правильным местом для кодирования запроса является сам маршрут.

Но прежде чем перейти к сути вашего вопроса, давайте немного поговорим о вашем код.

Я вижу, вы выполняете подключение к базе данных более одного раза, вы можете добавить выделенный контроллер базы данных, например:

контроллеры / db. js

var mysql = require('mysql');
var dotenv = require('dotenv');

dotenv.config({path: './.env'});

// Connection to MySQL
var db = mysql.createConnection({
  host:     process.env.DATABASE_HOST,
  user:     process.env.DATABASE_USER,
  password: process.env.DATABASE_PASSWORD,
  database: process.env.DATABASE
});

function connect(done) {
  db.connect(done);
}

module.exports = { db: db, connect: connect };

это позволяет вам получить доступ к экземпляру базы данных из каждого файла с помощью всего одной строки:

var db = require('./controllers/db').db;

, чем вы могли бы использовать функцию connect в своем приложении:

app. js

var express = require('express');
var db = require(./controllers/db);
var path = require('path');
var cookieParser = require('cookie-parser');

// set up your server
var app = express();

// Parse URL-Encoded bodies
app.use(express.urlencoded({extended: false}));
// Parse JSON bodies
app.use(express.json());
// Initialize a cookie
app.use(cookieParser());

// View engine to control HTML
app.set('view engine', 'hbs');

// Public dir
var publicDir = path.join(__dirname, './public');
app.use(express.static(publicDir));

// Define routes
app.use('/', require('./routes/pages'));
app.use('/auth', require('./routes/auth'));

// finally run your server only if you can connect to the database
db.connect(function(error) {
  if(error) return console.log("Error connecting to the database:", error);

  app.listen(3000, function() {
    console.log("Server is running on port 3000");
  });
});

вы также можете упростить controllers / auth. js удаление материала подключения к базе данных и использование только строки чтобы потребовать ваш контроллер базы данных.

Наконец, вы можете закодировать свой запрос:

маршруты / страницы. js

var express = require('express');
var authController = require('../controllers/auth');
var db = require('../controllers/db').db;

var router = express.Router();

// Omissis... other routes

// Premier League
router.get('/Leagues/EnglishDivision', authController.isLoggedIn, function(req, res) {
  // a good practice is first to handle possible exit cases to reduce nesting levels
  if(! req.user) return res.redirect('../../login');

  // this is actually the right place to perform queries
  db.query('SELECT ...', [...], function(error, results) {
    // once again first possible exit cases
    if(error) return res.status(500).end(error.message)

    res.render('PremierLeague', { results: results });
  });
});

module.exports = router;

Последний в вашем PremierLeague.hbs файл, вы можете обработать results в директиве #foreach.

0 голосов
/ 12 июля 2020

Просто передайте свои данные при рендеринге представления

    router.get('/Leagues/EnglishDivision', authController.isLoggedIn,  function(req, res) {
      if(req.user) {
       connection.query('SELECT * FROM EnglishDivision',function (err,results) {
        if (err) throw err;
        res.render('PremierLeague',{data: results});
    });
 
      } else {
        res.redirect('../../login');
      }
    });

затем в файле .hbs

  {{#each data}}
                <div class="card">
                    <h3>{{this.someData}}</h3>
                    <h2>{{this.someData}}</h2>
                </div>
            {{/each}}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...