前端提交数据
必备知识点
前端form表单中action属性，不写默认是当前路由地址
前端form表单中的method属性，不写默认是GET请求
前端页面
templates\register.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>注册页面</title>
<style>
fieldset {
width: 300px;
}
legend {
text-align: center;
}
</style>
</head>
<body>
<form action="">
<fieldset>
<legend>请输入用户名以及密码</legend>
<label for="username">账号：</label>
<input id="username" name="username" type="text" placeholder="在此处输入用户名">
<br>
<label for="password">密码：</label>
<input id="password" name="password" type="password">
<br>
<input type="submit" value="提交">
</fieldset>
</form>
</body>
</html>
后端页面
# views.py
from django.shortcuts import render
def register(request):
return render(request, 'register.html')
# views.py
from django.contrib import admin
from django.urls import path
from app import views
urlpatterns = [
path('admin/', admin.site.urls),
path('register/', views.register, name='register'), # name='register' 表示别名
]
get提交
当form表单不填写
method，直接提交时get方法，没有错误，后台可以拿到数据
post提交
当form表单提交方式为
method=post时，报错如下
解决方案，注释掉下面这个配置
# 将settings.py文件中的配置注释掉，在后面的学习中我们会逐步的解决掉这个问题
MIDDLEWARE = [
'django.middleware.security.SecurityMiddleware',
'django.contrib.sessions.middleware.SessionMiddleware',
'django.middleware.common.CommonMiddleware',
# 将这个配置先注释掉
# 'django.middleware.csrf.CsrfViewMiddleware',
'django.contrib.auth.middleware.AuthenticationMiddleware',
'django.contrib.messages.middleware.MessageMiddleware',
'django.middleware.clickjacking.XFrameOptionsMiddleware',
]
后端获取数据
request的属性以及方法
request.method
获取发起请求的请求方式
一般是GET或者POST 基于表单的method方法
get请求携带的数据是由大小限制的
post请求携带的请求参数没有限制
request.POST
获取用户输入的请求数据，但不包含文件
返回的是:大写字符串
前端页面
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>注册页面</title>
<style>
fieldset {
width: 300px;
}
legend {
text-align: center;
}
</style>
</head>
<body>
<form action="" method="post">
<fieldset>
<legend>请输入用户名以及密码</legend>
<label for="username">账号：</label>
<input id="username" name="username" type="text" placeholder="在此处输入用户名">
<br>
<label for="password">密码：</label>
<input id="password" name="password" type="password">
<br>
爱好：
<input name="hobby" id="kill" type="checkbox" value="kill">
<label for="kill">抢人头</label>
<input name="hobby" id="fish" type="checkbox" value="fish">
<label for="fish">摸鱼</label>
<input name="hobby" id="cut-class" type="checkbox" value="cut-class">
<label for="cut-class">逃课</label>
<br>
<input id="hobby" type="submit" value="提交">
</fieldset>
</form>
</body>
</html>
后端页面
# register
def register(request):
print('request.POST', request.POST)
print('request.GET', request.GET)
return render(request, 'register.html')
# 当以get方式提交的时候
# request.POST <QueryDict: {}>
# request.GET <QueryDict: {'username': ['小满'], 'password': ['123'], 'hobby': ['kill', 'fish', 'cut-class']}>
# 当以post方式提交的时候
# request.POST <QueryDict: {'username': ['小满'], 'password': ['123'], 'hobby': ['kill', 'fish', 'cut-class']}>
# request.GET <QueryDict: {}>
获取值
def register(request):
query_dict = request.POST if request.POST else request.GET # 三元运算符 哪一个有值从哪一个里面去取
username = query_dict.get('username') # 获取单个值
password = query_dict.get('password') # 获取单个值
hobby = query_dict.getlist('hobby') # 获取多个值，一般是用于接收form表单的多选框数据
print(username, password, hobby) # 小满 123 ['抢人头', '摸鱼', '逃课']
return render(request, 'register.html')
优化后的写法，可以这样但不建议
def register(request):
query_dict = request.POST if request.POST else request.GET
username, password, hobby = query_dict.values() # 修改了这里
print(username, password, hobby) # 小满 11223344 逃课
return render(request, 'register.html')
验证值
注册成功之后，跳转到登录页面
后端
# views.py
from django.shortcuts import redirect, HttpResponse, render
def login(request):
username = request.POST.get('username')
password = request.POST.get('password')
if username == "小满" and password == '123':
print(username, password)
return render(request, 'login.html', {'username': username})
else:
return HttpResponse('对不起，账号或者密码错误~')
def register(request):
if request.method == 'POST':
response = login(request)
if response.status_code == 200:
return response
return render(request, 'register.html')
# urls.py
from django.contrib import admin
from django.urls import path
from app import views
urlpatterns = [
path('admin/', admin.site.urls),
path('login/', views.login),
path('register/', views.register, name='register'), # name='register' 表示别名
前端
<!-- register.html -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>注册页面</title>
<style>
fieldset {
width: 300px;
}
legend {
text-align: center;
}
</style>
</head>
<body>
<form action="" method="post">
<fieldset>
<legend>请输入用户名以及密码</legend>
<label for="username">账号：</label>
<input id="username" name="username" type="text" placeholder="在此处输入用户名">
<br>
<label for="password">密码：</label>
<input id="password" name="password" type="password">
<br>
爱好：
<input name="hobby" id="kill" type="checkbox" value="抢人头">
<label for="kill">抢人头</label>
<input name="hobby" id="fish" type="checkbox" value="摸鱼">
<label for="fish">摸鱼</label>
<input name="hobby" id="cut-class" type="checkbox" value="逃课">
<label for="cut-class">逃课</label>
<br>
<input id="hobby" type="submit" value="提交">
</fieldset>
</form>
</body>
</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>欢迎进入主界面</title>
</head>
<body>
<p>{{ username}}，恭喜您登录成功！</p>
</body>
</html>
测试阶段
正确的用户名以及密码为：
小满、123
当我输入了错误的用户名或者密码时
对不起，账号或者密码错误~
当我输入了正确的用户名和密码
小满，恭喜您登录成功！