使用 Node.js 在 HTML 上显示来自 db 的数据答案

【问题标题】：Display data from db on HTML using Node.js使用 Node.js 在 HTML 上显示来自 db 的数据
【发布时间】：2022-02-09 01:08:47
【问题描述】：

我正在尝试获取一个网页来显示我的数据库中的数据并将其显示在表格中的 html 页面上，并能够通过在 ejs 中呈现它来在表格上向下滚动。我基于此站点的代码https://www.tutsmake.com/node-js-fetch-and-display-data-from-mysql-database-in-html-list/

我不太确定我做错了什么，数据库连接得很好，我的视图文件夹中有 ejs 文件。我猜这个问题来自 ejs 文件，但我不确定。我刚刚开始重新编码，所以这对我来说基本上是全新的。

当我转到 localhost:3000/test 时出现 404 错误，当我查看终端时显示 GET/TEST 404 20.377ms -1153，我想我可能会从有 75 行，我试图限制行数，但它仍然无法加载页面，并且由于某种原因，这段代码甚至找不到我的 ejs 文件。

根据我在网上阅读的内容，有上百万种不同的方法可以做到这一点，但我不知道从哪里开始让它发挥作用。我使用 mssql 作为我的数据库并使用 Visual Studio 构建所有内容。

这是我的 server.js

var createError = require('http-errors');
var express = require('express');
var path = require('path');
var cookieParser = require('cookie-parser');
var logger = require('morgan');
var expressValidator = require('express-validator');
var flash = require('express-flash');
var session = require('express-session');
var bodyParser = require('body-parser');

var sql = require("mssql/msnodesqlv8");
var connection = require('./lib/db');

var indexRouter = require('./routes/index');
var usersRouter = require('./routes/users');

var app = express();

// view engine setup
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');

app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

app.use(session({
   secret: '123456cat',
   resave: false,
   saveUninitialized: true,
   cookie: { maxAge: 60000 }
}))

app.use(flash());
app.use(expressValidator());

app.use('/', indexRouter);
app.use('/index', usersRouter);

// catch 404 and forward to error handler
app.use(function (req, res, next) {
   next(createError(404));
});

// error handler
app.use(function (err, req, res, next) {
   // set locals, only providing error in development
   res.locals.message = err.message;
   res.locals.error = req.app.get('env') === 'development' ? err : {};
   // render the error page
   res.status(err.status || 500);
   res.render('error');
});
module.exports = app;

这是我的 dbaCon.js

const sql = require("mssql/msnodesqlv8");

var conn = new sql.ConnectionPool({
    server: 'DESKTOP-BA7Q2HM',
    port: 1433,
    driver: 'msnodesqlv8',
    database: "tempdb",
    domain: 'DNAME',
    requestTimeout: 3600000,
    options: {
        trustedConnection: true,
        enableArtithAbort: true
    },
    debug: true,
    parseJSON: true
});

conn.connect(function (err) {
    if (err) throw err;
    console.log('Database is connected successfully!');
});
module.exports = conn;

这是我的 users.js

var express = require('express');
var router = express.Router();
var connection = require('../dbaCon.js');


/* GET home page. */
router.get('/', function (req, res, next) {

    connection.query('SELECT id, status, type, Date, Review * FROM [dba].[table] ', function (err, rows) {

        if (err) {
            req.flash('error', err);
            res.render('index', { page_title: "test - Node.js", data: '' });
        } else {

            res.render('index', { page_title: "test - Node.js", data: rows });
        }

    });
});

module.exports = router;

这是我的 index.ejs 文件

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Display Active Loan info to Client</title>
</head>
<body>
    <% if (messages.error) { %>
    <p style="color:red"><%- messages.error %></p>
    <% } %>
    <% if (messages.success) { %>
    <p class="alert alert-success mt-4"><%- messages.success %></p>
    <% } %>
    <br>
    <table class="table">
        <thead>
            <tr>
                <th scope="col">id</th>
                <th scope="col">status</th>
                <th scope="col">type</th>
                <th scope="col">date</th>
                <th scope="col">review</th>

            </tr>
        </thead>
        <tbody>
            <% if(data.length){
            for(var i = 0; i< data.length; i++) {%>
            <tr>
                <th scope="row"><%= (i+1) %></th>
                <td><%= data[i].id%></td>
                <td><%= data[i].status%></td>
                <td><%= data[i].type%></td>
                <td><%= data[i].date%></td>
                <td><%= data[i].review%></td>
            </tr>
            <% }
            }else{ %>
            <tr>
                <td colspan="3">No Data Availed</td>
            </tr>
            <% } %>
        </tbody>
    </table>
</body>
</html>

【问题讨论】：

"我想我可能会一次提取大量数据，因为有 75 行用于此"您能否详细说明您是如何得出 75 行是“ 很多”在任何现代计算环境中，或者404 Not Found HTTP 响应代码如何等同于尝试向客户端推送太多数据......？您能否明确指出您提供的定义您尝试请求的 /test 路由的任何代码的一部分？在请求不存在/未定义的路由时，您根本没有立即定义它，并且不清楚如何不会得到 404。
您的 SQL 查询不正确。我会解决的。

标签： javascript html node.js express ejs

【解决方案1】：

你没有“/test”的路由。

您有这些路由指向“/WHAT_YOU_HAVE_ON_indexRouter”和“/index/WHAT_YOU_HAVE_ON_userRouter”

app.use('/', indexRouter); app.use('/index', usersRouter);

在您的 userRouter 上，您没有“/test”路由，您需要添加它。

您到达 404 是因为应用找不到任何与“/test”相关的路线

【讨论】：

那么我将如何路由到我的 ejs 文件。在我的帖子中，我的意思是把 localhost/index 不是“测试”，所以这是我的错误。但我认为这段代码试图从路由中提取 index.js 文件，而不是从视图文件夹中的 index.ejs 中提取。那么我需要将我的 index.ejs 文件添加到路由文件夹中吗？或在views 文件夹中路由到我的index.ejs。基于我基于 ejs 文件的此代码的站点需要是 views 文件夹。这对我来说是全新的，所以像我 5 岁一样跟我说话
首先在路由 user.js 里面你需要创建你想要使用的路由 router.get('/MY_ROUTE', function (req, res, next) 你可以使用创建的那个作为模板，之后你需要渲染你想要使用的正确视图/页面 res.render('MY_PAGE', { page_title: "test - Node.js", data: '' }); 这个页面需要在视图文件夹，如果在另一个文件夹中，您还需要添加它 res.render('MY_FOLDER/MY_PAGE', { page_title: "test - Node.js", data: '' });
同样在本节中，您将预先附加一条路线到您当前的路线 app.use('/', indexRouter); app.use('/index', usersRouter); indexRouter 上的所有路由都可以只有一个简单的“/”，例如“localhost/”，但对于 userRouter，所有路由都需要有“/index/”，例如“localhost/index/”

【解决方案2】：

当我访问 localhost:3000/test 时出现 404 错误

您没有使用端点 /test 设置任何路由，至少在您发布的代码上没有设置任何路由，这就是您收到 404 not found 错误的原因。

我想我可能会一次提取大量数据，因为有 75 行用于此

不，75 行数据并不多。您应该编辑您的问题以澄清每个问题。

【讨论】：