flask_测试数据平台
2024-05-13 04:49:40
实现功能：Flask框架+平台访问+批量自动造测试数据
import osfrom flask import Flask, render_template, request, jsonify, url_for, redirect
from werkzeug.urls import url_parsefrom HuiCai import InsertHuiCaiOrderapp = Flask(__name__, template_folder='E:/flaskProject/templates')@app.route('/login')
def index():return render_template('login.html')@app.route('/home')
def home():return render_template('home.html')@app.route('/warn')
def warn():return render_template('warn.html')@app.route('/login', methods=['POST'])
def login():username = request.json.get('username')password = request.json.get('password')if username == 'admin' and password == 'password':return jsonify({'code': 0})else:return jsonify({'code': -1, 'message': '用户名或密码错误！'})@app.route('/create_order', methods=['POST'])
def create_order():data = request.form['order']order_number = InsertHuiCaiOrder(int(data))return order_number# 限制页面访问顺序
@app.before_request
def check_referer():if request.endpoint == 'home':referer = request.headers.get('Referer')if referer is None or url_parse(referer).path != url_for('login'):return redirect(url_for('warn'))if __name__ == '__main__':app.run()login登录页面
<!DOCTYPE html>
<html>
<head><link rel="icon" href="data:;base64,iVBORw0KGgo="><meta charset="utf-8"><title>用户登录</title><style>/* 样式调整 */form {width: 300px;margin: 20px auto;display: flex;flex-direction: column;align-items: center;justify-content: center;height: 100vh;}fieldset {border: none;}legend {font-size: 24px;margin-bottom: 20px;}label {display: block;margin-bottom: 10px;}input[type=text], input[type=password] {width: 100%;padding: 5px;margin-bottom: 10px;display: none; /* 初始隐藏输入框 */}input[type=submit] {background-color: #3a4b53;color: #fff;border: none;padding: 10px;cursor: pointer;display: none; /* 初始隐藏提交按钮 */}.error {font-size: 14px;color: red;margin-top: 10px;}.mask {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.5); /* 添加遮罩 */}</style>
</head><body>
<style>form {width: 100%;margin: 0 auto;display: flex;flex-direction: column;align-items: center;justify-content: center;height: 100vh;background-image: url('../static/images/zhuomian.gif');background-size: cover;background-repeat: no-repeat;background-position: center;}
</style>
<form><div class="mask"></div> <!-- 添加遮罩 --><fieldset><legend>用户登录</legend><label for="username">用户名:</label><input type="text" id="username" name="username" placeholder="请输入用户名"><label for="password">密码:</label><input type="password" id="password" name="password" placeholder="请输入密码"><input type="submit" value="登录"><p class="error"></p></fieldset>
</form><script type="text/javascript">window.onload = function () {// 隐藏输入框和提交按钮var inputs = document.querySelectorAll('input[type="text"], input[type="password"], input[type="submit"]');for (var i = 0; i < inputs.length; i++) {inputs[i].style.display = 'none';}// 绑定鼠标点击事件，显示输入框和提交按钮document.querySelector('.mask').addEventListener('click', function (event) {event.preventDefault();this.style.display = 'none';for (var i = 0; i < inputs.length; i++) {inputs[i].style.display = 'block';}document.querySelector('#username').focus(); // 自动聚焦到用户名输入框});// 绑定登录表单提交事件document.querySelector('form').addEventListener('submit', function (event) {event.preventDefault(); // 阻止表单默认提交行为var username = document.querySelector('#username').value;var password = document.querySelector('#password').value;if (!username || !password) {showError('用户名和密码均不能为空！');return;}// 发送登录请求var xhr = new XMLHttpRequest();xhr.open('POST', '/login');xhr.setRequestHeader('Content-Type', 'application/json;charset=UTF-8');xhr.onreadystatechange = function () {if (xhr.readyState === XMLHttpRequest.DONE && xhr.status === 200) {var response = JSON.parse(xhr.responseText);if (response.code === 0) {window.location.href = '/login'; // 登录成功跳转到首页} else {showError(response.message); // 显示错误信息}}};xhr.send(JSON.stringify({'username': username,'password': password}));});// 显示错误信息function showError(message) {document.querySelector('.error').innerText = message;}}
</script>
</body>
</html>home页面，输入后–调取后端接口–loading等待–回显返回结果
<!DOCTYPE html>
<html>
<head><title>创建订单</title><script src="https://code.jquery.com/jquery-3.5.1.min.js"></script><style>.container {position: relative;display: flex;flex-direction: column;justify-content: center;align-items: center;height: 100vh;}.form {display: flex;flex-direction: column;justify-content: center;align-items: center;}label {margin-bottom: 10px;}#order-input {width: 200px;margin-bottom: 20px;}#submit-btn {width: 100px;}#loading {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);display: none;background-color: #ccc;border-radius: 5px;text-align: center;line-height: 50px;width: 100px;height: 50px;}#result {margin-top: 20px;font-weight: bold;}</style>
</head>
<body>
<div class="container"><form class="form"><label for="order-input">填写需要的慧采订单数量：</label><input type="text" id="order-input" name="order-input"><br/><br/><button id="submit-btn" type="button">提交</button></form><div id="loading">加载中...</div><div id="result"></div>
</div>
<script>$(document).on('click', '#submit-btn', function () {var order = $('#order-input').val();$('#loading').show();$.ajax({url: '/create_order',type: 'POST',data: {order: order},success: function (response) {$('#loading').hide();var result = JSON.stringify(response);$('#result').text(result);$('#result').show();alert('订单创建成功');},error: function (xhr, textStatus, errorThrown) {$('#loading').hide();alert('订单创建失败');}});});
</script>
</body>
</html>login.html页面2.0
<!DOCTYPE html>
<html>
<head><meta charset="UTF-8"><title>动态登录页面</title><style>body {background-color: #1E1F26;color: #FFFFFF;font-family: Arial, sans-serif;font-size: 16px;margin: 0;padding: 0;}.container {display: flex;justify-content: center;align-items: center;height: 100vh;}form {background-color: #282A36;border-radius: 10px;box-shadow: 0px 0px 10px 0px #FFFFFF;padding: 30px;text-align: center;width: 400px;}input {background-color: #44475A;border: none;border-radius: 5px;color: #FFFFFF;font-size: 16px;margin-bottom: 20px;padding: 10px;width: 100%;}input[type="submit"] {background-color: #50FA7B;cursor: pointer;font-weight: bold;transition: background-color 0.3s ease-in-out;}input[type="submit"]:hover {background-color: #FF5555;}h1 {font-size: 28px;margin-bottom: 30px;}.loading {display: none;font-size: 20px;margin-top: 20px;}.error {font-size: 14px;color: red;margin-top: 10px;}.loading:before {content: "";display: inline-block;height: 20px;width: 20px;border-radius: 50%;border: 2px solid #FFFFFF;border-top-color: transparent;animation: spin 0.8s linear infinite;margin-right: 10px;vertical-align: middle;}@keyframes spin {to {transform: rotate(360deg);}}</style>
</head>
<body>
<div class="container"><form><h1>登录</h1><label for="username">用户名</label><input type="text" id="username" name="username" required><label for="password">密码</label><input type="password" id="password" name="password" required><input type="submit" value="登录"><div class="loading">登录中，请稍候...</div><p class="error"></p></form>
</div>
<script>const form = document.querySelector('form');const loading = document.querySelector('.loading');form.addEventListener('submit', (event) => {event.preventDefault();loading.style.display = 'inline-block';var username = document.querySelector('#username').value;var password = document.querySelector('#password').value;if (!username || !password) {showError('用户名和密码均不能为空！');return;}// 发送登录请求var xhr = new XMLHttpRequest();xhr.open('POST', '/login');xhr.setRequestHeader('Content-Type', 'application/json;charset=UTF-8');xhr.onreadystatechange = function () {if (xhr.readyState === XMLHttpRequest.DONE && xhr.status === 200) {var response = JSON.parse(xhr.responseText);if (response.code === 0) {console.log(11111)window.location.href = '/create'; // 登录成功跳转到首页} else {form.reset();loading.style.display = 'none';showError(response.message); // 显示错误信息}}};xhr.send(JSON.stringify({'username': username,'password': password}));});// 显示错误信息function showError(message) {document.querySelector('.error').innerText = message;}
</script>
</body>
</html>
flask_测试数据平台相关推荐
- 不写一行代码，基于Jmeter打造性能测试数据平台
前 言 在服务端性能测试工具中,Jmeter毫无疑问是其中的王者,拥有开源.轻便.灵活.学习成本低等等很多优点. 但是在压测过程中,也有很多不便之处,最不方便的地方,就是执行压测过程中,没有实时展示的 ...
- Arya-专业web自动化测试平台
学名:web自动化测试平台 英文名:Arya 出生日期:2018年3月22日 现居住地:http://arya.iflytek.com ( 家教严,只能邀请爱测未来团队的小伙伴来玩 ) 兄弟姐妹:自动 ...
- qt4的quick程序升级到qt5_最新8月书单出炉！送给你程序员
8月好书赏不停,喜欢的就收藏一下. 1.计算广告:互联网商业变现的市场与技术(第2版) 作者:刘鹏.王超 全球第一本全面讲解计算广告与互联网变现秘密的专业图书升级版 @北冥乘海生 刘鹏老师力作:众多互 ...
- eBay测试老兵的修炼之道：如何从测试“小工”到测试“专家”？
很多人对软件测试这个职业都带有刻板偏见的认知,比如说他们觉得测试"入门门槛低,没啥技术含量"."对公司来说不重要"."操作简单工作枯燥".& ...
- 软件调试第二版卷一硬件基础 pdf_2020全球C++及系统软件技术大会，C++之父领衔...
2020年是全球IT科技版图震荡和转折之年,系统级软件作为数字世界的核心基础设施,被视为"卡脖子"技术的关键,成为IT产学研"兵家必争之地".C++语言一直被誉 ...
- 好巧，七夕最新8月书单出炉！送给你程序员
8月好书赏不停,七夕奉上8月新书单,请收下. 1.计算广告:互联网商业变现的市场与技术(第2版) 作者:刘鹏.王超 全球第一本全面讲解计算广告与互联网变现秘密的专业图书升级版 @北冥乘海生 刘鹏老师力 ...
- 测试工程师全栈技术进阶与实践读书笔记
第一章 软件测试基础知识精要(上) 1.1 从"用户登录"测试谈起 1.1.1 功能测试用例 1.1.2 更多的测试用例 1.1.3 功能性需求与非功能性需求 对显式功能性需求的验 ...
- JB的阅读之旅-软件测试52讲（下）
17)精益求精:聊聊提高GUI测试稳定性的关键技术 问题:同样的测试用例在同样的环境上,时而测试通过,时而测试失败: 造成GUI测试不稳定的常见五种因素: 非预计的弹出对话框: 页面控件属性的细微变化 ...
- 如何才能设计出一个“好的”测试用例？
1.21"好的"测试用例的定义 在正式开始讲解之前,先讲一下什么是"好的"测试用例,这个"好"又应该体现在哪些方面.这两个问题看似简单实则难 ...
最新文章
- 基于mysql传统复制模式转为GTID模式 mysql 5.7版本
- mysql 开启远程
- python3 限定方法参数 返回值 变量 类型
- setsockopt()函数功能介绍
- 湘潭计算机职业技术学校专业介绍,湘潭计算机职业技术学校介绍
- 【笔记】An explainable deep machine vision framework for plant stress phenotyping
- 技术晋升的评定与博弈
- 使用严格模式的坏处_再见面试官：单例模式有几种写法？
- Git版本控制：Git高级教程
- [Android] Android RxJava2+Retrofit2+OkHttp3 的使用(一) --基础篇 Retrofit2 的使用
- ps 显示当前进程的状态
- Web基础配置篇（八）: 远程操作工具、命令的介绍、安装及基本使用
- web前端面试高频考点——Vue面试题
- oracle nav函数,WordPress函数wp_nav_menu()怎样用_CMS体系建站教程
- 五百万微商都在用微信智能获客小程序，你还不加入？
- 【Python turtle】使用turtle实现随机满天星星效果（完整代码+效果图）
- 学习记录3——PMSM数学建模——simulink内数学模型搭建以及仿真
- Java控制器controller_实现接口Controller定义控制器
- PHP各大音乐平台API接口下载,PHP各大音乐平台API接口
- 137所大学双一流学科建设名单
热门文章
- 手把手教你如何通过CC2531抓取Zigbee包，并解析加密Zigbee包
- 发光二极管pcb封装图画法_基础篇 -- 二极管
- 【故障处理】EXP-00003: no storage definition found for segment
- java lambda表达式条件_java_Lambda表达式
- Modbus转Profinet网关连接皖仪氦质谱检漏仪SFJ-16M通信配置案例
- python并发编程--进程、线程、协程、锁、池、队列
- 推荐三款我常备开发辅助神器
- DNA偶联PbSe量子点|近红外硒化铅PbSe量子点修饰脱氧核糖核酸DNA|PbSe-DNA QDs
- 前端解决跨域-代理服务器-跨域（二）
- H3C 三层交换机 设置俩vlan不能相互通讯，只能访问某个端口，且其中一个vlan不能上网...