帮我用HTML和python写一个web程序 HTML实现如下功能:标题是“一键通系统”,副标题是“零一技术 × 华为云服务”,居中对齐,加粗。有三个输入框和一个输出框,三个输入框的名称分别是“密保号码”“手机号一”“手机号二”,输出框的名称是“中转号码”,输出框只用来输出,不能填写任何内容。输入框和输出框的大小一样。还有一个“提交按钮”,用于提交数据。三个输入框是必填的,不填写完整不允许提交,并提醒。运用你的能力将这个页面设计的好看。 Python实现如下功能: 第一步,读取HTML页面“密保号码”输入的内容,和data.csv中的的数据做比对,如果“密保号码”的内容在第一列,则对变量time赋值数字5,如果“密保号码”的内容在第二列,则对变量time赋值数字10,如果“密保号码”的内容在第三列,则对变量time赋值数字30,如果“密保号码”的内容在第四列,则对变量time赋值数字60,如果在这四列中都不存在,则在输出框中输出“密保号码错误”,并终止程序执行。 第二步,读取手机号码一和手机号码二,分别赋值给phone1和phone2。 第三步,将time,phone1和phone2合并输出到输出框中。 第四步:将第一步读取到的“密保号码”放在log.csv中,并记录存入的时间。 并一步一步教我怎么实现HTML和python的连接并运行这个web程序,文件夹怎么设置,各个文件怎么放。
时间: 2024-03-21 19:43:31 浏览: 110
好的,我来一步步教你如何实现这个web程序。
首先,我们需要在本地搭建一个web服务器来运行这个程序。我们选择使用Python内置的http.server模块来搭建一个简单的web服务器。
1. 首先,你需要在本地创建一个文件夹,用来放置你的HTML页面、Python脚本和数据文件。我们假设这个文件夹的名字为`webapp`。
2. 在`webapp`文件夹中创建一个名为`index.html`的文件,用来编写你的HTML页面代码。可以按照上面的要求来编写,这里给出一个示例:
```
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>一键通系统</title>
<style>
body {
font-family: Arial, sans-serif;
text-align: center;
}
h1 {
font-weight: bold;
}
input[type=text] {
width: 300px;
padding: 10px;
margin: 10px;
border: 1px solid #ccc;
border-radius: 5px;
font-size: 16px;
}
input[type=submit] {
padding: 10px 20px;
background-color: #007bff;
color: #fff;
border: none;
border-radius: 5px;
font-size: 16px;
cursor: pointer;
}
.output {
width: 300px;
height: 100px;
padding: 10px;
margin: 10px;
border: 1px solid #ccc;
border-radius: 5px;
font-size: 16px;
overflow: auto;
}
</style>
</head>
<body>
<h1>一键通系统</h1>
<h2>零一技术 × 华为云服务</h2>
<form action="/submit" method="post">
<input type="text" name="secret" placeholder="密保号码">
<input type="text" name="phone1" placeholder="手机号一">
<input type="text" name="phone2" placeholder="手机号二">
<input type="submit" value="提交">
</form>
<div class="output" id="output"></div>
<script>
// 在此处编写JavaScript代码,用来从服务器获取数据并显示在输出框中
</script>
</body>
</html>
```
这里我们使用了一些CSS样式来美化页面。注意,我们在form元素中设置了`action="/submit"`,这是为了让表单数据提交到服务器的`/submit`路径上。
3. 在`webapp`文件夹中创建一个名为`server.py`的文件,用来编写你的Python代码。可以按照上面的要求来编写,这里给出一个示例:
```
import http.server
import socketserver
import urllib.parse
import csv
import datetime
class Handler(http.server.SimpleHTTPRequestHandler):
def do_POST(self):
content_length = int(self.headers['Content-Length'])
body = self.rfile.read(content_length)
params = urllib.parse.parse_qs(body.decode())
secret = params['secret'][0]
phone1 = params['phone1'][0]
phone2 = params['phone2'][0]
time = get_time(secret)
if time is None:
self.send_error(400, '密保号码错误')
return
output = '{} {} {}'.format(time, phone1, phone2)
with open('log.csv', 'a', newline='') as f:
writer = csv.writer(f)
writer.writerow([secret, output, datetime.datetime.now()])
self.send_response(200)
self.send_header('Content-type', 'text/plain')
self.end_headers()
self.wfile.write(output.encode())
def get_time(secret):
with open('data.csv', 'r') as f:
reader = csv.reader(f)
for row in reader:
if secret in row:
if row.index(secret) == 0:
return 5
elif row.index(secret) == 1:
return 10
elif row.index(secret) == 2:
return 30
elif row.index(secret) == 3:
return 60
return None
if __name__ == '__main__':
PORT = 8000
with socketserver.TCPServer(("", PORT), Handler) as httpd:
print("serving at port", PORT)
httpd.serve_forever()
```
这个Python代码的作用是:接收来自HTML页面的POST请求,读取表单数据,根据密保号码在`data.csv`中查找对应的时间,将密保号码、合并后的数据和当前时间写入`log.csv`中,最后将合并后的数据返回给HTML页面。
4. 在`webapp`文件夹中创建一个名为`data.csv`的文件,用来存放密保号码和对应的时间。可以按照上面的要求来编写,这里给出一个示例:
```
123456,5,10,30,60
654321,10,30,60,120
```
这个文件中的每一行代表一个密保号码和对应的四个时间,用逗号分隔。
5. 在`webapp`文件夹中创建一个名为`log.csv`的文件,用来存放每次提交的数据和时间。这个文件可以先留空,程序会自动将数据写入。
6. 打开命令行(Windows用户可以按`Win+R`键,输入`cmd`后按回车键打开命令行),进入到`webapp`文件夹中,输入以下命令来启动web服务器:
```
python server.py
```
这个命令会启动一个web服务器,监听在本机的8000端口上。
7. 打开浏览器,访问`http://localhost:8000/index.html`,就可以看到你编写的web页面了。在输入框中输入数据,点击提交按钮,就可以将数据提交到服务器上并在输出框中显示结果了。
至此,我们就完成了一个简单的web程序的开发。
阅读全文
相关推荐










