请使用javascrip读取mysql数据库内容并呈现到前端页面
时间: 2023-09-16 17:14:00 浏览: 42
首先,你需要安装mysql模块,可以使用npm来安装:
```
npm install mysql
```
然后在你的项目中引入mysql模块:
```javascript
const mysql = require('mysql');
```
接下来,你需要连接你的数据库:
```javascript
const connection = mysql.createConnection({
host: 'localhost',
user: 'root',
password: 'password',
database: 'database_name'
});
connection.connect(err => {
if (err) {
console.error('error connecting: ' + err.stack);
return;
}
console.log('connected as id ' + connection.threadId);
});
```
这里需要替换host、user、password、database_name为你的数据库相关信息。
连接成功后,你可以执行查询操作:
```javascript
connection.query('SELECT * FROM table_name', (err, rows) => {
if (err) throw err;
console.log('Data received from Db:\n');
console.log(rows);
});
```
这里需要替换table_name为你要查询的表名。
最后,你可以将查询结果呈现到前端页面,例如使用express框架:
```javascript
const express = require('express');
const app = express();
app.get('/', (req, res) => {
connection.query('SELECT * FROM table_name', (err, rows) => {
if (err) throw err;
res.send(rows);
});
});
app.listen(3000, () => console.log('Example app listening on port 3000!'));
```
这里需要替换table_name为你要查询的表名,然后在浏览器中访问http://localhost:3000即可看到查询结果。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)