Django 学習記録: Django の初期理解と、シンプルな Web ログイン ページのフロントエンドおよびバックエンド開発の実装
1. まずテンプレートフォルダーを削除し、設定内のこの行を削除できます。
2. pycharm でアプリを作成します。
3. アプリを起動します。URL とビュー関数 [urls.py] の関係を記述します。
ビュー関数を書く [views.py]
pycharm プロジェクトを開始する
4. 静的ファイルの参照
2 つのファイル インポートがあります: (jquery と bootstrap)
jquery: https://code.jquery.com/jquery-3.6.0.min.js 直接コピーしてメモ帳を作成し、保存して js ファイルに変更して使用できます。
bootstrap: https://v3.bootcss.com/getting-started/#download は Web サイトから直接ダウンロードできますが、ダウンロードは github 上にあります。(必要に応じて、私にプライベートメッセージを送っていただくこともできます)
テンプレートの構文
view 関数のレンダリング内部:
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>
Web ページには次の内容が表示されます。
リクエストとレスポンス
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>
ログインが失敗した場合: 次のインターフェイスが表示され、ログインが成功した場合は Web ページがリダイレクトされます。
コースソース:
2022 Station B の最も詳細な django3 チュートリアル (入門から実践までの django)