Question

*我知道这里有很多代码，但是很长一段时间以来我一直在为这个问题而苦苦挣扎。

具有Express，MySQL数据库和EJS模板引擎的Node.js应用程序。我是一个新手。

我有一个javaScript（getScoresData.js）文件，该文件从MySQL数据库返回数据，并包含创建JavaScript对象的代码。该对象包含我需要发送到前端（以创建数据图表）的值。当我运行getSCoresData.js文件时，代码会将对象返回到控制台，因此我知道这部分正在工作。

但是，我不知道如何正确实现此code / js文件，以便通过我的路由将对象发送到前端。我也不知道getScoresData.js实际上应该放在项目结构中的哪个位置，或者我应该如何模块化getScoresData.js文件。

结构是..

project/ 
  app/ 
    routes.js 
  config/ 
    database.js 
    passport.js 
  models/ 
    getScoresData.js 
  public/ 
    scripts/ 
       dataGraph.js 
    views/ 
server.js

下面的getScoresData.js


// db connection
var mysql = require('mysql');
var dbconfig = require('../config/database');
const connection = mysql.createConnection(dbconfig.connection);

//Sql Query
const scoreQuery = "SELECT question1, question2, question3, question4, question5, question6, question7, question8 FROM assessment_score";

//variable to hold score array
var scoreArray;


//returning the sql query
connection.query(scoreQuery, function (err, result) {
    if (err) throw err;

    //running getData() function
    getData(result);
    console.log(scoreArray);

    // Slicing the array to make 8 categories
    var category1 = scoreArray.slice(0,1);
    var category2 = scoreArray.slice(2,3);
    var category3 = scoreArray.slice(4,5);
    var category4 = scoreArray.slice(6,7);

    //parsing and accumlating each category score
    var cat1Total = totalScore(category1);
    var cat2Total = totalScore(category2);
    var cat3Total = totalScore(category3);
    var cat4Total = totalScore(category4);


    //this is the object I want to send to client side to use in the graphData.js file
    const categories = {cat1Total, cat2Total, cat3Total, cat4Total}

});

//function to turn sql result into an array of strings
function getData(result) {

    Object.keys(result).forEach(function(key) {
        const values = result[key];
        return scoreArray = Object.values(values);
    });
}

// function to parse the strings into numbers and accumulate them
function totalScore(categoryScore){
    return categoryScore.reduce((accum,scoreArray) =>
        {
            const splitValues = scoreArray.split('/');

            return {
                score:accum.score + parseInt(splitValues[0]),
                maxScore:accum.maxScore + parseInt(splitValues[1]),
            }
        },{score:0,maxScore:0}
    );
}

routes.js文件

我想通过/profile路由发送数据，因此当用户登录时，他们将在个人资料上显示其得分数据的图表。

module.exports = function(app, passport){
    app.get('/', function(req, res){
        res.render('index.ejs');
    });

    app.get('/login', function (req, res){
        res.render('login.ejs', {message: req.flash('loginMessage')});
    });

    app.post('/login', passport.authenticate('local-login',{
            successRedirect: '/profile',
            failureRedirect: '/login',
            failureFlash: true
        }),
        function(req, res){
            if(req.body.remember){
                req.session.cookie.maxAge = 1000 * 60 * 3;
            }else{
                req.session.cookie.expires = false;
            }
            res.redirect('/');
        });


    app.get('/profile', isLoggedIn, function (req, res) {
        res.render('profile.ejs', {user:req.user
        })
    });


};


function isLoggedIn(req, res, next) {
    if(req.isAuthenticated())
        return next();

    res.redirect('/');
});

dataGraph.js文件 -我想使用categories对象创建图形的地方


var ctx = document.getElementById("myChart").getContext('2d');

//Where I want to use the data sent through routes
var barTotalCategoryScores = [categories.cat1Total.score, categories.cat2Total.score, categories.cat3Total.score, categories.cat4Total.score];

var labels = ["Java & Design", "Build & Versioning"];

var myChart = new Chart(ctx, {
    type: 'bar',
    data: {
        labels: labels,
        datasets: barTotalCategoryScores
          }
    }
});

如何通过路由将前端数据库中的数据从Node.js发送到前端JavaScript文件？

0 个答案: