-1

嗨，我正在尝试将 html 代码从 String 注入到视图中，但尝试时遇到了一些错误，我卡住了：

这是 Node.js 路线上的代码：

router.get('/profile/:page', isLoggedIn, async (req, res) => {
    // Get current page from url (request parameter)
    let page_id = parseInt(req.params.page);
    let currentPage = 0;
    if (page_id > 0) currentPage = page_id;

    //Change pageUri to your page url without the 'page' query string 
    pageUri = '/profile/';


    /*Get total items*/
    await pool.query('SELECT COUNT(id) as totalCount FROM user where user_type="Client"', async (err, result,) => {

        // Display 10 items per page
        const perPage = 10,
            totalCount = result[0].totalCount;
        console.log("Estos son los datos",totalCount, currentPage, pageUri, perPage);
        // Instantiate Pagination class
        const Paginate = new Pagination(totalCount, currentPage, pageUri, perPage);


        /*Query items*/
        const data = {
            users: await pool.query('SELECT * FROM user where user_type="Client" LIMIT ' + 10 + ' OFFSET ' + Paginate.offset),
            pages: Paginate.links()// Paginate.lins()->return a variable with all html
        }

        res.render('profile', { data });
        
    });
});

这是 Links() 函数

class Pagination{
    
    constructor(totalCount,currentPage,pageUri,perPage=2){
        this.perPage = perPage;
        this.totalCount =parseInt(totalCount);
        this.currentPage = parseInt(currentPage);
        this.previousPage = this.currentPage - 1;
        this.nextPage = this.currentPage + 1;
        this.pageCount = Math.ceil(this.totalCount / this.perPage);
        this.pageUri = pageUri;
        this.offset  = this.currentPage > 1 ? this.previousPage * this.perPage : 0;
        this.sidePages = 4;
        this.pages = false;
    }
    
    
    
    links(){
        this.pages='<ul class="pagination pagination-md">';
    
        if(this.previousPage > 0)
            this.pages+='<li class="page-item"><a class="page-link" href="'+this.pageUri + this.previousPage+'">Previous</a></li>';
    
    
            /*Add back links*/
            if(this.currentPage > 1){
                for (var x = this.currentPage - this.sidePages; x < this.currentPage; x++) {
                    if(x > 0)
                        this.pages+='<li class="page-item"><a class="page-link" href="'+this.pageUri+x+'">'+x+'</a></li>';
                }
            }
    
            /*Show current page*/
            this.pages+='<li class="page-item active"><a class="page-link" href="'+this.pageUri+this.currentPage+'">'+this.currentPage+'</a></li>';
    
            /*Add more links*/
            for(x = this.nextPage; x <= this.pageCount; x++){
    
                this.pages+='<li class="page-item"><a class="page-link" href="'+this.pageUri+x+'">'+x+' </a></li>';
    
                if(x >= this.currentPage + this.sidePages)
                    break;
            }
    
    
            /*Display next buttton navigation*/
            if(this.currentPage + 1 <= this.pageCount)
                this.pages+='<li class="page-item"><a class="page-link" href="'+this.pageUri+this.nextPage+'">Next</a></li>';
    
            this.pages+='</ul>';
    
        return this.pages;
    }

    

    }
    module.exports = Pagination;

在 HTML 中：

<div id="pages">
                               
{{ data.pages }}

</div>

最后，我的浏览器出现错误，不允许我从路径发送的 html 正确读取。请帮助我。我卡住了

这是游泳池： const pool = require('../database');

这是 database.js：

const mysql = require('mysql');
const { promisify } = require ('util');

const { database } = require('./keys');
const pool= mysql.createPool(database);

pool.getConnection((err, connection)=>{
    if(err){
        if(err.code === 'PROTOCOL_CONNECTION_LOST'){
            console.error('DATABASE CONNECTION WAS CLOSED');
        }
        if(err.code === 'ER_CON_COUNT_ERROR'){
            console.error('DATABASE HAS TO MANY CONNECTIONS');
        }
        if(err.code === 'ECONNREFUSED'){
            console.error('DATABASE CONNECTION WAS REFUSED');
        }
    }
    if (connection) connection.release();
    console.log('DB is CONNECTED');
    return;
});

//Promisify Pool Querys
pool.query = promisify(pool.query);

module.exports = pool;

浏览器也只检测文本，不检测代码。

在浏览器中查看源 在 此处输入图像描述

您正在使用哪个确切的数据库库？要求（'mysql'）

而且，您的浏览器中的错误究竟是什么？

在此处输入图像描述

4

1 回答 1

0

默认情况下，您的模板引擎会转义您插入页面的任何文本，以便将其呈现为文本，而不会意外地解释为 HTML。这就是您注入的 HTML 显示为纯文本的原因。

如果你想注入实际的 HTML，那么你必须告诉模板引擎你不希望它逃避这个特定的插入。当您告诉我们您正在使用什么模板引擎时，我们可以帮助您了解如何做到这一点。

要阻止 Handlebars 转义 HTML，只需使用三重大括号，如下所示：

<div id="pages">
                               
{{{ data.pages }}}

</div>

这是描述它的相关文档页面。

此外，在您使用它的任何一个地方都await不起作用pool.query()，因为 mysql 模块不支持承诺，因此await除了承诺之外的其他东西没有任何用处。您可以使用 mysql2 模块require('mysql2/promise')来获得 mysql2 的内置承诺支持。然后，不要传递回调，只需使用返回的承诺。

于 2021-02-09T05:09:23.853 回答