在本文中，我们将引导大家完成创建 HTML 注册表单的过程，然后使用 CGI 脚本获取并以卡片的形式显示提交的用户数据以及成功消息。注册表是许多网络应用程序的基本组成部分，允许用户提供访问或会员资格的基本信息。通过集成 CGI 脚本，我们可以捕获和处理这些数据，增强用户交互性并提供无缝的用户体验。
在 CGI 中处理表单数据
以下是我们在 CGI 脚本中处理表单数据的步骤：
第 1 步：实施
首先，在"htdocs" 目录中创建一个名为"form"的文件夹。在此"form"文件夹中，创建两个文件："html.html"和"python.py"。在"html.html"文件中，设计注册表单。在"python.py"文件中，编写一个 CGI 脚本以从注册表中检索数据并生成带有成功消息的卡片。
文件结构
第 2 步：编写 HTML 代码 (html.html)
现在我们将编写 HTML 文件代码，在其中创建一个表单，该表单将用于使用 CGI 脚本处理表单数据。此代码使用 CSS 创建一个具有基本样式的注册表单。当用户提交表单时，数据将被发送到表单的"action"属性中指定的服务器端脚本进行处理。
HTML
html
<!DOCTYPE html>
<html>
<head>
<title>Registration Form</title>
<style>
h1 {
color: green;
}
.form-container {
padding: 20px;
margin: 20px;
border: 1px solid #ccc;
border-radius: 5px;
}
label {
display: block;
margin-bottom: 10px;
}
input[type="text"],
input[type="email"],
input[type="password"] {
width: 30%;
padding: 10px;
margin-bottom: 15px;
border: 1px solid #ccc;
border-radius: 5px;
}
input[type="submit"] {
background-color: green;
color: white;
padding: 10px 20px;
border: none;
border-radius: 5px;
cursor: pointer;
}
</style>
</head>
<body>
<h1>haiyong</h1>
<div class="form-container">
<h2>Registration Form</h2>
<form action="python.py" method="post">
<label for="name">Name:</label>
<input type="text" name="name" required><br><br>
<label for="email">Email:</label>
<input type="email" name="email" required><br><br>
<label for="password">Password:</label>
<input type="password" name="password" required><br><br>
<input type="submit" name="Register">
</form>
</div>
</body>
</html>第3步：编写Python CGI脚本（python.py）
这是一个 Python 脚本，充当 Web 表单提交的服务器端处理程序。它处理从 HTML 表单发送的表单数据并生成 HTML 响应以确认注册。这是代码的解释：
检索表单数据：
- name = form.getvalue('name')：从提交的表单中检索"name"字段的值。
- email = form.getvalue('email')：从提交的表单中检索"email"字段的值。
- password = form.getvalue('password')：从提交的表单中检索"password"字段的值。
总之，此 Python 脚本处理表单数据、提取值并生成 HTML 响应以确认注册，包括用户的姓名、电子邮件和成功消息。
Python3
python
#!C:\Program Files\Python311\python.exe
print("Content-type: text/html\n\n")
import cgi
# Get form data
form = cgi.FieldStorage()
# Retrieve values from the form
name = form.getvalue('name')
email = form.getvalue('email')
password = form.getvalue('password')
# HTML response
print("<html>")
print("<head>")
print("<title>Registration Confirmation</title>")
print("<style>")
print(" /* Style for the card container */")
print(" .card {")
print(" width: 300px;")
print(" padding: 20px;")
print(" margin: 20px auto;")
print(" border: 1px solid #ccc;")
print(" border-radius: 5px;")
print(" text-align: center;")
print(" }")
print("</style>")
print("</head>")
print("<body>")
print("<div class='card'>")
print("<h2>Registration Confirmation</h2>")
print("<p>Name: " + name + "</p>")
print("<p>Email: " + email + "</p>")
# You should never display passwords like this in a real application; this is just for demonstration purposes
print("<p>Password: " + password + "</p>")
print("<p>Registration Successful! </p>") # Emoji for success
print("</div>")
print("</body>")
print("</html>")第4步：配置并启动Xampp服务器
可以参考如何创建CGI脚本来完成配置以及我们如何启动服务器来运行CGI脚本。
第 5 步：运行脚本
这里我们可以在 Web 浏览器中使用以下命令运行 CGI 脚本
python
http://127.0.0.1/form/html.html总结
通过本文，我们成功地创建了一个简单而实用的HTML注册表单，并通过CGI脚本处理了用户提交的数据。以下是我们涵盖的主要步骤和概念：
- 创建HTML注册表单： 我们设计了一个包含姓名、电子邮件和密码字段的注册表单。通过CSS样式，我们使表单看起来更具吸引力。
- 编写Python CGI脚本： 我们创建了一个Python脚本，它作为Web表单提交的服务器端处理程序。该脚本使用CGI库来获取表单数据，然后生成一个包含用户提供信息的卡片形式的HTML响应。
- 表单数据的检索： 在Python脚本中，我们使用
cgi.FieldStorage()来检索通过表单提交的数据。我们从字段中提取姓名、电子邮件和密码的值。 - HTML响应生成： 我们生成了一个简单但清晰的HTML响应，确认用户的注册。该响应包括用户的姓名、电子邮件和密码，并显示注册成功的消息。
通过集成HTML表单和Python CGI脚本，我们实现了用户与Web应用程序的互动。这种技术在许多网络应用程序中都是常见的，例如注册、登录和数据提交等。希望这篇文章对您理解和应用HTML表单和CGI脚本的组合提供了有益的指导。