html 不能直接连接数据库，必须通过后端服务（如node.js、php）实现；前端仅用fetch等请求api获取数据，数据库操作和连接均在服务端完成。
HTML 本身不能连接数据库
浏览器里的 HTML 是纯静态标记语言，没有执行能力，更不支持直接访问数据库。所谓“HTML 连接数据库”，实际是混淆了前端和后端职责——真正干活的是服务器端程序（比如 Node.js、PHP、Python/Flask），HTML 只负责展示它返回的数据。
常见错误现象：XMLHttpRequest 或 fetch 请求返回 404、500、或空数据，但你在 HTML 里写了 <script>fetch('/api/users')</script> ——这说明后端没搭好，或者路由根本不存在。
- 所有数据库操作必须在服务端完成，HTML 页面通过 HTTP 请求（如
GET /api/data）获取 JSON 或 HTML 片段 - 不能把数据库连接信息（如
mysql://user:pass@localhost/db）硬编码进 HTML 或前端 JS，否则等于公开密码 - 浏览器控制台里看到的
Failed to load resource很可能是因为后端没启动，而不是 HTML 写错了
用 fetch + 后端 API 获取数据库数据的最小可行路径
假设你用 Node.js + Express + SQLite，前端 HTML 要显示用户列表，核心是让 HTML 发请求、后端查库、返回 JSON。
使用场景：小项目、原型验证、内部工具，不需要复杂框架。
立即学习“前端免费学习笔记（深入）”；
模板采用响应式设计，自动适应手机，电脑及平板显示；满足单一店铺外卖需求。功能：1.菜单分类管理2.菜品管理：菜品增加，删除，修改3.订单管理4.友情链接管理5.数据库备份6.文章模块：如：促销活动，帮助中心7.单页模块：如：企业信息，关于我们更强大的功能在开发中……安装方法：上传到网站根目录，运行http://www.***.com/install 自动
- 后端需提供一个接口，比如
app.get('/api/users', ...)，里面执行db.all('SELECT * FROM users', ...) - HTML 中用
fetch('/api/users')拿到数据后，用document.createElement动态插入表格或列表 - 注意响应头：后端必须设置
Content-Type: application/json，否则response.json()会失败 - 跨域问题常见于本地开发：若 HTML 用
file://打开，fetch会因 CORS 被拒；必须用本地服务器（如http-server或后端起的服务）打开 HTML
fetch('/api/users')
.then(r => r.json())
.then(data => {
data.forEach(u => {
const el = document.createElement('div');
el.textContent = u.name;
document.body.appendChild(el);
});
});为什么不能用 PHP/Python 直接嵌入 HTML 文件
有人把 .html 改成 .php，然后写 <?php $pdo = new PDO(...); ?> ——这看似“HTML 连数据库”，但本质是服务器把 PHP 编译成 HTML 后再发给浏览器。关键点在于：文件后缀和服务器配置必须匹配。
常见错误现象：.php 文件在浏览器里直接显示源码，或报 Parse error: syntax error ——说明 Web 服务器（如 Apache 或 Nginx）没装 PHP 模块，或没配置 .php 解析规则。
- Apache 需启用
libphp模块，并在.htaccess或虚拟主机中允许AllowOverride All - Nginx 需配置
fastcgi_pass指向 PHP-FPM，且location ~ \.php$规则生效 -
mysql_connect()已被废弃，必须用PDO或mysqli，否则运行时报Call to undefined function - 数据库连接失败时，
PDO::__construct()抛出PDOException，默认不显示错误；需设setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION)
前端连数据库的“例外”：仅限特定场景和工具
极少数情况下，前端能绕过传统后端直连数据库，但有严格限制，不是通用方案。
使用场景：低敏感数据的内部仪表盘、本地开发调试、边缘计算设备（如树莓派上跑 SQLite）。
-
SQLite可通过sql.js在浏览器内存中运行，但数据库文件得先用fetch下载到前端，且无法持久写回服务器 -
Supabase或Firebase提供客户端 SDK，表面像“前端直连”，实则是它们的后端做了权限代理和 SQL 封装，你配的是anon key，不是数据库地址 - 用
WebAssembly跑数据库引擎（如WASM SQLite）仅用于离线分析，和服务器数据库无关 - 任何宣称“HTML+JS 直连 MySQL”的教程，大概率混淆了开发环境（如 XAMPP 自带 Apache+PHP+MySQL）和生产部署逻辑
事情说清了就结束。真正卡住人的，从来不是 fetch 怎么写，而是搞不清哪段代码该跑在浏览器里、哪段必须塞进服务器进程里。
