文档建议反馈控制台
首页
学习
活动
专区
圈层
工具
MCP广场
文章/答案/技术大牛
发布

html连接mysql数据库代码

要使用HTML连接MySQL数据库，您需要创建一个后端服务器来处理HTML表单提交的数据并与MySQL数据库交互

  1. 首先，安装Node.js和npm（如果尚未安装）。
  2. 创建一个新的项目文件夹，并在其中初始化一个新的Node.js项目：
代码语言：javascript
代码运行次数：0
复制
mkdir my_project
cd my_project
npm init -y
  1. 安装必要的依赖项：
代码语言：javascript
代码运行次数：0
复制
npm install express mysql body-parser ejs

这将安装Express（用于创建Web服务器），MySQL（用于连接MySQL数据库），body-parser（用于解析请求正文）和EJS（用于渲染HTML模板）。

  1. 在项目文件夹中创建一个名为app.js的文件，并添加以下代码：
代码语言：javascript
代码运行次数：0
复制
const express = require('express');
const bodyParser = require('body-parser');
const mysql = require('mysql');
const ejs = require('ejs');

const app = express();
app.use(bodyParser.urlencoded({ extended: false }));
app.set('view engine', 'ejs');

// 创建MySQL连接
const connection = mysql.createConnection({
  host: 'localhost',
  user: 'your_username',
  password: 'your_password',
  database: 'your_database'
});

connection.connect((err) => {
  if (err) throw err;
  console.log('Connected to MySQL database!');
});

// 创建一个简单的HTML表单
app.get('/', (req, res) => {
  res.render('index', { title: 'Connect MySQL' });
});

// 处理表单提交的数据
app.post('/submit', (req, res) => {
  const { name, email } = req.body;

  const query = 'INSERT INTO users (name, email) VALUES (?, ?)';
  connection.query(query, [name, email], (err, results) => {
    if (err) throw err;
    res.send('Data inserted successfully!');
  });
});

// 启动服务器
const port = process.env.PORT || 3000;
app.listen(port, () => {
  console.log(`Server is running on port ${port}`);
});

请确保将your_username，your_password和your_database替换为您的MySQL数据库的实际凭据。

  1. 在项目文件夹中创建一个名为views的文件夹，并在其中创建一个名为index.ejs的文件。添加以下HTML代码：
代码语言：javascript
代码运行次数：0
复制
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title><%= title %></title>
</head>
<body>
  <h1>Connect MySQL with HTML</h1>
  <form action="/submit" method="post">
    <label for="name">Name:</label>
    <input type="text" id="name" name="name" required>
    

    <label for="email">Email:</label>
    <input type="email" id="email" name="email" required>
    

    <button type="submit">Submit</button>
  </form>
</body>
</html>
  1. 在MySQL数据库中创建一个名为users的表，包含id，name和email字段：
代码语言：javascript
代码运行次数：0
复制
CREATE TABLE users (
  id INT AUTO_INCREMENT PRIMARY KEY,
  name VARCHAR(255) NOT NULL,
  email VARCHAR(255) NOT NULL
);
  1. 运行应用程序：
代码语言：javascript
代码运行次数：0
复制
node app.js

现在，您可以在浏览器中访问http://localhost:3000，看到一个简单的HTML表单。提交表单后，数据将插入到MySQL数据库的users表中。

页面内容是否对你有帮助？
有帮助
没帮助

相关·内容

点击加载更多

热门标签

更多标签

活动推荐

    运营活动

    活动名称
    广告关闭

    腾讯云开发者

    扫码关注腾讯云开发者

    扫码关注腾讯云开发者

    领取腾讯云代金券

    热门产品

    热门推荐

    更多推荐

    Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

    深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 粤公网安备44030502008569号

    腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号

    领券