当前位置:网站首页>Mei cole studios - fifth training DjangoWeb application framework + MySQL database
Mei cole studios - fifth training DjangoWeb application framework + MySQL database
2022-08-11 06:17:00 【C_yyy89】
目录
前言
本文记录梅科尔工作室IoT组DjangoWeb 应用框架+MySQLDatabase of fifth training notes,Mainly including Hongmeng app 登录请求与实现(另外一种方式:不使用 model.py 文件,Table migration is not performed)And dynamically read the data content in the text box 2.Django 后端数据验证(MySQL 数据库数据查询)
这里感谢潘学姐的讲解!辛苦啦!
1.App 登录请求与实现
1.1.views.py连接数据库
代码如下:
try:
ct = pymysql.connect(host='127.0.0.1', # 或者是写localhost
port=3306, # 端口号
user='root', # MySQL登录用户名
password='xxx', # MySQL登录密码
db='test2', # 要连接的数据库名称
charset='utf8') # 表的字符集
print("数据库连接成功")
except pymysql.Error as er:
print('连接失败'+str(er))
1.2.前端编程
Hml代码如下:
<div class="cb-container">
<div class="cb-title">
<text class="cb-title-text">
登录测试
</text>
</div>
<image src="../../common/images/123.png"></image>
<div class="container1">
<div>
<input name="username" class="input" type="text" maxlength="10" placeholder="用户名" onchange="inputAccount"/>
</div>
</div>
<div class="container2">
<div>
<input name="password" class="input" type="password" maxlength="10" placeholder="密码" onchange="inputPassword"/>
</div>
</div>
<div class="container">
<button onclick="onClick" class="btn-map" style="background-color: darkturquoise; height: 50px;">立即登录</button>
</div>
<div>
<text>
{
{winfo}}
</text>
</div>
</div>
效果如下:
JS文件代码如下:
import router from '@system.router';
import fetch from '@system.fetch';
import qs from 'querystring';
export default {
data:{
winfo:"" //定义winfo用于存放后端反馈数据
},
inputAccount(a){
this.username = a.value;
},
inputPassword(a){
this.password = a.value;
},
onClick(){
fetch.fetch({
url:`http://127.0.0.1:8007/student/AppReq1/`, //后端路径,一定不能错,用的是反单引号
data: qs.stringify({'username':'123456','password':'12345'}),//验证,将字符串转发给后端,后端会受到这个请求
responseType:"json",//请求的参数类型
method: "POST",
success:(resp)=>
{
this.winfo = resp.data;//令获取到的后端数据赋给winfo
console.log("返回的数据:"+this.winfo);//打印出数据
},
fail:(resp)=>
{
this.winfo = resp.data;//令获取到的后端数据赋给winfo
console.log("获取数据失败:"+this.winfo)//打印出数据
}
});
}
}
css代码不再展示,Badly written hahaha,头疼!
1.2.建表(不依赖DJango)
这里使用的是Navicat,在左侧栏,Select the database where you want to create the table,Right-click and select New Table,原理就是跳过DjangoOperate directly on the database,不需要代码,如下所示:
注意,建好表之后,The back-end code should correspond to the table name and the data in the table.
1.3.后端编程
new path login
from django.urls import path
from . import views
from student.views import AppReq1,login
app_name ='student'
urlpatterns = [
path('AppReq1/', AppReq1.as_view()),
path('login/', login.as_view()),
]
views.py新增login类
class login(APIView): # login类视图
def post(self,request): # 创建post方法
username = request.data.get("username") # Get frontend feedback valueusername
password = request.data.get("password") # Get frontend feedback valuepassword
print(username)
cur = ct.cursor() # 创建游标
sql = "select * from login where name =%s" # sqlStatement to query data table data,to be the same as the datasheet
values = (username)
try:
if cur.execute(sql, values): # 执行sql语句
ct.commit()
results = cur.fetchall()
for row in results:
# The obtained list corresponds to the column,注意id为第0列
Pusername = row[1] # 获取数据name
Ppassword = row[2] # 获取数据pwd
print(Pusername) # 打印PusernameVerify whether to get it
print(Ppassword) # 打印PpasswordVerify whether to get it
if password ==Ppassword: # 验证密码是否正确
print("账号密码验证通过")
return HttpResponse('Welcome honorable'+Pusername)
else:
print('查无此人!')
except pymysql.Error as e:
print("查无此人:"+str(e))
return HttpResponse("请求失败")
注意点:The data key-value pair that the front end feeds back to the back end“键”,Must correspond to the backend,The data in the table obtained by the backend must correspond to the data in the table.
2.效果展示
前端展示:
后端展示:
总结
The above is the content of the notes and effects of the fourth training to show this article,The main thing is the correspondence between the front and back ends and the data,Thank you Miss Pan!!!
边栏推荐
- 华为手机软键盘挡住Toast
- 【uniapp】跨端开发问题记录
- Severe Weather 3D Object Detection Dataset Collection
- @2022-02-22:每日一语
- SCNet: Semantic Consistency Networks for 3D Object Detection
- DNS外带注入SQLMAP
- The kernel communicates with user space through character devices
- GBase 8s是如何保证数据一致性
- 解决Glide图片缓存问题,同一url换图片不起作用问题
- Maykel Studio - Django Web Application Framework + MySQL Database Fourth Training
猜你喜欢
随机推荐
C语言字节对齐,看这篇就够了
Maykel Studio - Django Web Application Framework + MySQL Database Second Training
静态综合复习实验
安全帽识别系统-解决监管难题
MGRE环境下的OSPF综合实验
基于uniapp开发的聊天界面
基于AI智能图像识别:4个不同的行业应用
Hard hat identification
梅科尔工作室-PR第三次培训笔记(效果与转场及插件使用)
CVPR2022——A VERSATILE MULTI-VIEW FRAMEWORK
AI-based intelligent image recognition: 4 different industry applications
梅科尔工作室-第四次PR培训笔记(字幕和标题动画,关键帧动画和声音处理)
Robust 3D Object Detection in Cold Weather Conditions
安全帽识别
>>开发工具:IDEA格式化代码无效
梅科尔工作室-Pr第一次培训笔记(安装及项目创建)
梅科尔工作室-华为云ModelArts第一次培训
LiDAR Snowfall Simulation for Robust 3D Object Detection
Use regex to verify whether the file name is legal
对MySQL查询语句的分析