当前位置：首页 > 行业动态 > 正文

htm调用sql数据库

通过PHP等服务器端脚本，利用ODBC/MySQLi连接HTML与SQL数据库，实现数据

环境准备

安装Web服务器与数据库

组件 说明
Web服务器 Apache/Nginx/IIS
数据库 MySQL/MariaDB/PostgreSQL
后端语言 PHP/Node.js/Python/ASP.NET
集成工具 XAMPP/WAMP/MAMP（含Apache+MySQL+PHP）

数据库配置

  • 创建数据库：CREATE DATABASE mydb;
  • 创建用户并授权：GRANT ALL PRIVILEGES ON mydb. TO 'user'@'localhost' IDENTIFIED BY 'password';

后端语言选择

语言 特点 适用场景
PHP 轻量级、广泛支持 快速开发中小型网站
Node.js 异步处理、全栈开发 实时应用、API服务
Python 简洁语法、丰富库 数据分析、机器学习
ASP.NET 企业级框架、强类型语言 大型系统、团队开发

数据库连接与操作

PHP连接MySQL示例（PDO）

// 数据库配置
$host = 'localhost';
$dbname = 'mydb';
$user = 'user';
$pass = 'password';
$dsn = "mysql:host=$host;dbname=$dbname;charset=utf8";
// 建立连接
try {
    $pdo = new PDO($dsn, $user, $pass, [
        PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION,
        PDO::ATTR_DEFAULT_FETCH_MODE => PDO::FETCH_ASSOC
    ]);
    echo "连接成功";
} catch (PDOException $e) {
    die("连接失败: " . $e->getMessage());
}

常用SQL操作方法对比

操作类型 PHP（PDO） Node.js（mysql2） Python（pymysql）
查询 $pdo->query() connection.query() cursor.execute()
插入 $pdo->prepare()->execute() connection.promise() cursor.execute()
更新 $pdo->exec() connection.query() cursor.execute()
删除 $pdo->exec() connection.query() cursor.execute()

安全与优化

防止SQL注入

  • 预处理语句：$stmt = $pdo->prepare("SELECT FROM users WHERE id = ?"); $stmt->execute([$id]);
  • 参数绑定：Node.js中使用占位符，Python使用%s格式化

错误处理

try {
    // 执行SQL语句
} catch (PDOException $e) {
    error_log("数据库错误: " . $e->getMessage());
    echo "发生错误，请稍后重试";
}

前端数据展示

使用AJAX获取数据

fetch('api.php')
    .then(response => response.json())
    .then(data => {
        // 动态生成HTML表格
        let table = '<table><tr><th>ID</th><th>Name</th></tr>';
        data.forEach(row => {
            table += `<tr><td>${row.id}</td><td>${row.name}</td></tr>`;
        });
        table += '</table>';
        document.getElementById('data-container').innerHTML = table;
    });

后端JSON接口示例（PHP）

header('Content-Type: application/json');
$stmt = $pdo->query('SELECT  FROM users');
$result = $stmt->fetchAll();
echo json_encode($result);

综合案例：用户登录系统

数据库设计

字段名 类型 说明
id INT(11) 主键自增
username VARCHAR(50) 用户名
password VARCHAR(255) 哈希密码

核心代码流程

  1. 前端提交表单 → 2. PHP接收$_POST数据 → 3. 查询用户是否存在 → 4. 验证密码 → 5. 设置Session
// 验证登录
$stmt = $pdo->prepare("SELECT  FROM users WHERE username = ?");
$stmt->execute([$username]);
$user = $stmt->fetch();
if ($user && password_verify($password, $user['password'])) {
    session_start();
    $_SESSION['user_id'] = $user['id'];
}

相关问题与解答

Q1：为什么HTML不能直接调用SQL数据库？

A：HTML是标记语言，不具备逻辑处理能力，必须通过后端语言（如PHP）解析HTML请求,再由后端连接数据库完成数据操作。

Q2：除了PHP，还有哪些方式可以实现HTML与SQL的交互？

A：

  1. Node.js：使用Express框架+mysql模块 
    app.get('/data', (req, res) => {
    connection.query('SELECT  FROM table', (err, results) => {
        if (err) throw err;
        res.json(results);
    });
});
  2. Python：使用Flask+pymysql 
    @app.route('/api')
def get_data():
    cursor = conn.cursor()
    cursor.execute("SELECT  FROM table")
    return jsonify(cursor.fetchall())
sql数据库数据库连接
0

相关文章