Django 학습기록: Django에 대한 초기 이해 및 간단한 웹 로그인 페이지의 프론트엔드, 백엔드 개발 구현
1. 먼저 템플릿 폴더를 삭제하고 설정에서 이 줄을 삭제할 수 있습니다.
2. pycharm에서 앱을 만듭니다.
3. 앱 시작: URL과 보기 함수 사이의 관계 작성 [urls.py]
뷰 함수 작성 [views.py]
pycharm 프로젝트 시작
4. 정적 파일 참조
두 가지 파일 가져오기가 있습니다: (jquery 및 bootstrap)
jquery: https://code.jquery.com/jquery-3.6.0.min.js 직접 복사해서 메모장을 만들고 저장한 후 js 파일로 변경해서 사용할 수 있습니다.
bootstrap: https://v3.bootcss.com/getting-started/#download 홈페이지에서 직접 다운로드도 가능하지만, 다운로드 끝은 github에서 입니다. (필요하신 경우 개인 메시지를 보내주실 수도 있습니다)
템플릿 구문
보기 함수의 렌더링 함수 내부:
1. 템플릿 구문이 포함된 HTML 파일 읽기
2. 내부적으로 렌더링(템플릿 구문이 실행되고 데이터가 교체됨)되고 최종적으로 HTML 태그만 포함된 문자열이 얻어집니다.
3. 렌더링된(교체된) Wow Great Wall 문자열을 사용자의 브라우저에 반환합니다.
views.py 아래의 코드:
from django.shortcuts import render,HttpResponse
# Create your views here.
def index(request):
return HttpResponse("欢迎使用")
def user_list(request):
# 1.如果未删除默认setting中dirs那行代码，则有限去项目根目录的templates中寻找（提前先配置）【不配置就是无效】
# 2.根据app的注册顺序，在每个app下的templates目录中寻找【更改设置后】
return render(request, "user_list.html")
def user_add(request):
return render(request, "user_add.html")
def tpl(request):
name = "饺子"
# 列表，元组与列表相同
role =["保安","CEO","管理员"]
# 字典
user_info={
"name":"包子","salary":10000,"role":"CTO"}
data_list=[
{
"name": "包子", "salary": 10000, "role": "CTO"},
{
"name": "馒头", "salary": 10000, "role": "CTO"},
{
"name": "馄饨", "salary": 10000, "role": "CTO"},
]
return render(request, "tpl.html", {
"n1":name, "n2":role,"n3":user_info,"n4":data_list})
tpl.html 아래의 코드:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>模板语法的学习</h1>
<div>{
{ n1 }}</div>
<div>{
{ n2 }}</div>
<div>{
{ n2.0 }}</div>
<div>{
{ n2.1 }}</div>
<div>{
{ n2.2 }}</div>
<div>
{% for item in n2 %}
<span>{
{ item }}</span>
{% endfor %}
</div>
<hr/>
{
{ n3 }}
{
{ n3.name }}
{
{ n3.role }}
<ul>
{% for k,v in n3.items %}
<li>{
{ k }}={
{ v }}</li>
{% endfor %}
</ul>
<hr/>
{
{ n4.0 }}
{
{ n4.1.name }}
{% for item in n4 %}
<div>{
{ item.name }} {
{ item.salary }}</div>
{% endfor %}
<hr/>
{% if n1 == "饺子" %}
<h1>dadadadada</h1>
{% else %}
<h1>dududududu</h1>
{% endif %}
</body>
</html>
웹페이지에 다음이 표시됩니다.
요청과 응답
def sth(request):
# request是一个对象，封装了用户发送过来的所有请求相关数据
# 1.获取请求方式 GET/POST
print(request.method)
# 2.在URL上传递值(即在网址后面添加：/sth/?n1=123&n2=999,则会传回n1，n2对应的值)
print(request.GET)
# 3.在请求体中提交数据
print(request.POST)
# 4. （响应）HttpResponse("返回内容"),内容字符串内容返回给请求者
# return HttpResponse("返回内容")
# 5.（响应）读取HTML的内容 + 渲染（替换） —> 字符串，返回给用户浏览器
# return render(request,'sth.html',{"title":"来了"})
# 6.（响应）让浏览器重定向到其他的页面
return redirect("http://www.baidu.com")
로그인 인터페이스 작성
def login(requset):
if requset.method == "GET":
return render(requset, "login.html")
# 如果是POST请求，获取用户提交的数据
# print(requset.POST)
username = requset.POST.get("user")
password = requset.POST.get("pwd")
if username == 'root' and password == "123":
# return HttpResponse("登陆成功")
return redirect("https://www.bbac.com.cn/cn/")
# 可删去else，以省略嵌套。
else:
# return HttpResponse("登陆失败")
return render(requset, 'login.html', {
"error_msg": "用户名或密码错误"})
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>用户登录</h1>
<form method="post" action = "/login/">
{% csrf_token %}
<input type = "text" name = "user" placeholder="用户名">
<input type = "password" name = "pwd" placeholder="密码">
<input type = "submit" value="提交">
<span style="color:red;"> {
{ error_msg }}</span>
</form>
</body>
</html>
로그인에 실패하면 다음 인터페이스가 나타나고, 로그인에 성공하면 웹페이지가 리디렉션됩니다.
강좌 출처:
2022 Station B의 가장 상세한 django3 튜토리얼(django 입문부터 실습까지)