html - 如何通过 html 文件显示 MySQL 数据库中的内容?
问题描述
是否可以打开一个 html 文件,让它向服务器端应用程序发送一些信号以从 mysql db 查询数据,然后将该数据返回到该原始 html 文件?因此,与其让一些 php 或 js 程序吐出一个 html 文件,我可以创建一个“index.html”文件,当我点击它时,会显示我的数据库的内容吗?谢谢
解决方案
如果问题仅限于使用 HTML,那么这是不可能的。
如果您的意思是只使用静态 HTML 页面(允许内联 JavaScript),那么有很多方法可以做您想做的事。
您可以使用客户端 JavaScript,在静态页面中提供服务,从而无需运行像 Node JS 或其他类型的非静态 Web 服务器这样的后端。
像这样的静态 HTML 文件:
<html>
<head>
<title>Using Fetch</title>
</head>
<body>
<script>
// Fetch your information here using client side JavaScript
// Do something
</script>
</body>
</html>
您的服务器端应用程序可以公开一个输出一些 JSON 的端点,我们将使用该端点https://example.com/api/
并使用Fetch API获取它:
let url = 'https://example.com/api/';
fetch(url)
.then(res => res.json())
.then((data) => {
// Your data is in the variable 'data', do something with it
})
.catch(err => { throw err });
您的 HTML 文件可能看起来像这样:
<html>
<head>
<title>Using Fetch</title>
</head>
<body>
<p id="data"></p>
<script>
let url = 'https://example.com/api/';
fetch(url)
.then(res => res.json())
.then((data) => {
document.getElementById("data").innerHTML = data;
})
.catch(err => { throw err });
</script>
</body>
</html>
该代码是从端点获取一些数据并在页面上设置段落以显示该信息的基本示例。
推荐阅读
- c++ - strange return behavior in strcat()
- laravel - How to solve Uncaught SyntaxError: Unexpected token '<' using Vue JS / Laravel
- api - 如何找到 Web 应用程序的 API?无需任何工具
- javascript - 为所有地区应用相同的颜色谷歌地理图表
- python-3.x - Using discord.py, want to make a hyperlink using a link that doesn't start with https://
- visual-studio-code - Can the VSCode NPM Script Explorer source .nvmrc before running a script?
- django - How to update SQLite with no access to a C compiler or yum in a remote server?
- python - How to do Live 3D plotting in Python
- python - Numpy矩阵广播问题
- python - 如何在 FastAPI 正文验证中使用可区分的联合类型?(模型上的联合)