在 express 应用程序中,public 文件夹中的 javascript 文件如何访问 index.js 下的 routes 文件夹中写入的数据库 API

In an express application ,how can the javascript file in public folder access the database API written in routes folder under index.js

该项目的目标是,通过单击客户端的按钮访问位于 localhost/phpmyadmin 的 mysql 数据库,并从数据库中获取数据以在客户端填写 table。

此项目是使用快速应用程序完成的。 数据库接口代码写在routes文件夹下,index.js文件:

var express = require('express');
var router = express.Router();
var mysql = require('mysql');

var connection = mysql.createConnection({
    'host':'localhost',
    'user':'root',
    'password':'',
    'database':'displayu'
});

connection.connect();

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


router.get('/getusers',function(req,res,next){
    var x;
    connection.query('SELECT * FROM sample', function(err,result,field){
        if (err){
            throw error;
        }
        else{
            x = res.json(result);
            console.log(x);
        }
    });

});
module.exports = router;

localhost:3000 上,在 index.html 下的视图文件夹中编写的客户端代码和 public 文件夹下的 javascript 逻辑导致一个按钮和一个空的 table.I 想要使用在服务器端路由文件夹下编写的代码点击此按钮访问数据库并将此数据填充到 table。 我不知道执行此要求的确切步骤。我有客户端代码和服务器端代码,但需要帮助 link 它们才能获得输出。

如前所述,您可以通过从客户端 js 发出 AJAX 请求来实现。

您可以使用 XMLHttpRequest 实用程序对本机 JavaScript 执行此操作。

例如:

function populateTable() {
    // Handle your data here..
}

var GetUsersData = new XMLHttpRequest();
GetUsersData.addEventListener("load", reqListener);
GetUsersData.open("GET", "/getusers");
GetUsersData.send();

您也可以使用 jQuery,具体取决于您的项目。如果您已经使用它,我建议使用包含的 jQuery.get() 函数,这比使用原生 JS 简单得多。

如果你现在没有在你的项目中使用 jQuery,你应该坚持使用 JS 原生方式,这也取决于你想发出多少 AJAX 请求,也记住你有多少 manage/debug 前进。

这两种方式都非常有趣,我建议您至少阅读其中一种,因为它们非常有用,您有时不得不再次使用 AJAX。