时间戳

首页 > 解决方案 > 使用 nodeJS 显示为 HTML

javascript - 使用 nodeJS 显示为 HTML

问题描述

我对NodeJS真的很陌生，我想了解的是是否有办法像JS一样使用NodeJS，我正在尝试从数据库中获取信息，并将其显示在我的index.html中的一个div中。当我尝试通过 queryselector 执行此操作时，我收到一个错误，到目前为止，我所做的是将新页面中的数据作为 JSON 接收。我的 index.html 文件中有一个名为 content-txt 的 div，这是我放置响应的地方。此外，当我尝试遍历行时，我收到Error [ERR_HTTP_HEADERS_SENT]: Cannot set headers after they are sent to the client.

到目前为止我的代码：app.js：

var express = require('express');
var mysql = require('mysql');
var app = express();

var connect = mysql.createConnection({
    // Properties
    host: 'localhost',
    user: 'root',
    password: '',
    database: 'dyextension'
});

connect.connect(function(error) {
    if(!!error) {
        console.log('Could not connect to DB');
    } else {
        console.log('Successfully connected to DB');
    }
});

app.listen(5500, ()=>console.log('Express server is running on port no: 5500'));

// Get all alerts
app.get('/alerts', (req,res)=>{
    connect.query('SELECT * FROM alerts', (err,rows,fields)=>{
        if(!err){
            for(let i=0; i<rows.length; i++){
                res.send(`<div>${rows[i].alert_name}</div>`);

            }
        }
        else
        console.log(err);
    });
});

索引.html：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>
    <!-- Bootstrap CDN -->
    <link href="https://stackpath.bootstrapcdn.com/bootswatch/4.3.1/litera/bootstrap.min.css" rel="stylesheet" integrity="sha384-D/7uAka7uwterkSxa2LwZR7RJqH2X6jfmhkJ0vFPGUtPyBMF2WMq9S+f9Ik5jJu1" crossorigin="anonymous">
    <title>d</title>
</head>
<body>
      <!-- Content here -->
      <div class="container" id="content-txt">

      </div>
    <script src="app.js"></script>
</body>
</html>

标签： javascripthtmlnode.jsexpress

解决方案

按照设计，HTTP 协议只能返回一次响应。

使用您的代码执行此操作的方法是将您的结果连接到一个变量，然后将该变量作为响应返回。

var express = require('express');
var mysql = require('mysql');
var app = express();

var connect = mysql.createConnection({
    // Properties
    host: 'localhost',
    user: 'root',
    password: '',
    database: 'dyextension'
});

connect.connect(function(error) {
    if(!!error) {
        console.log('Could not connect to DB');
    } else {
        console.log('Successfully connected to DB');
    }
});

app.listen(5500, ()=>console.log('Express server is running on port no: 5500'));

// Get all alerts
app.get('/alerts', (req,res)=>{
    connect.query('SELECT * FROM alerts', (err,rows,fields)=>{
        if(!err){
            let results;
            for(let i=0; i<rows.length; i++){
                results += `<div>${rows[i].alert_name}</div>`;

            }
            return res.send(results);
        }
        else
        console.log(err);
    });
});

推荐阅读