TIME
创建一个简单的验证码登录网页涉及到前端和后端的开发。这里我会提供一个简单的示例，包括前端HTML页面和后端生成验证码的逻辑（这里使用Python Flask作为后端框架）。请注意，这只是一个基础的示例，实际生产环境中需要考虑更多的安全性和性能优化。
前端HTML页面（login.html）:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Login Page</title>
</head>
<body>
<div>
<h2>Login</h2>
<form action="/login" method="post">
<input type="text" name="username" placeholder="Username" required>
<input type="password" name="password" placeholder="Password" required>
<!-- 这里展示验证码 -->
<img src="/captcha" alt="captcha">
<!-- 输入框用于输入验证码 -->
<input type="text" name="captcha" placeholder="Captcha">
<button type="submit">Login</button>
</form>
</div>
</body>
</html>后端Python Flask代码:
首先确保安装了 Flask 和其他必要的库，如 Pillow 用于生成验证码图片，可以使用 pip 安装这些库。
from flask import Flask, render_template, request, redirect, url_for
from PIL import Image, ImageDraw, ImageFont
import random, string, os
import flask_sqlalchemy as fsa # 用于数据库操作，这里只是一个示例，实际项目中可能需要更复杂的数据库操作。
from flask_login import LoginManager # 用于用户认证管理，这里只是一个基础示例，实际项目中可能需要集成更复杂的认证系统。
import flask_WTF as wtf # 用于表单处理，这里只是一个基础示例，实际项目中可能需要集成更复杂的表单验证逻辑，但在此示例中我们主要关注验证码生成和验证，因此不会涉及这些库的具体使用，请自行查阅相关文档以获取更多信息。
app = Flask(__name__) # 创建 Flask 应用实例，这里省略了配置数据库和登录管理器等初始化代码，请自行查阅相关文档以获取更多信息，主要关注验证码生成和验证的逻辑。
``python继续添加后端代码以生成验证码并处理登录请求：``pythonapp.route(’/login’)(def login():form = LoginForm() # 这里假设你已经创建了一个LoginForm类用于处理表单数据if form.validate(): # 表单验证成功username = form.username.data password = form.password.data captcha_input = form.captcha.data captcha_path = os.path.join(’path_to_store_captcha’, f’{username}.png’) # 存储验证码图片的路径，可以根据实际需求修改生成验证码并保存图片到服务器captcha_code = ’’.join(random.choices(string.ascii_uppercase + string.digits, k=5)) # 生成一个随机的验证码图片内容img = Image.new(’RGB’, (200, 100), color=(random.randint(0, 255), random.randint(0, 255), random.randint(0, 255)))draw = ImageDraw.Draw(img)font = ImageFont.truetype(’arial’, 36)draw.text((10, 10), captcha_code, font=font)img.save(captcha_path)session[’username’] = username # 将用户名保存到session中return redirect(url_for(’dashboard’))else:return render_template(’login.html’, form=form)app.route(’/captcha’)(def get_captcha():username = session[’username’] if ’username’ in session else None captcha_code = ’’.join(random.choices(string.ascii_uppercase + string.digits, k=5))img = create_captcha_image(captcha_code)response = send_file(img, mimetype=’image/png’)response.headers[’Cache-Control’] = ’no-store’return responseif __name__ == ’__main__’:app.run()def create_captcha_image(text):# 创建验证码图片的逻辑img = Image.new(’RGB’, (200, 100), color=(random.randint(0, 255), random.randint(0, 255), random.randint(0, 255)))draw = ImageDraw.Draw(img)font = ImageFont.truetype(’arial’, 36)draw.text((10, 10), text, font=font)return imgdef send_file(*args, **kwargs):# 使用 Flask 的 send_file 函数发送文件