Django---Django返回用戶輸入數據

時間 2020-02-06

原文原文鏈接

　　前面寫了關於HTML和Django結合的文章，經過視圖與HTML結合，而後加上urls渲染返回給用戶瀏覽器。很明顯咱們都能看到這些僅僅是靜態HTML，那如何經過Django建立動態的HTML呢？html

動態的頁面

咱們先經過一個例子來簡單瞭解下。django

一、首先經過在views.py文件中添加一些動態的數據

# Views.py

from django.http import HttpResponse
import datetime

# 建立動態數據
def time(request):
    now = datetime.datetime.now()
    html = '如今的時間爲%s'%now
    return HttpResponse(html)

二、經過urls.py文件渲染給瀏覽器

# urls.py

from django.contrib import admin
from django.urls import path
from Anjing import views

urlpatterns = [
    path('admin/', admin.site.urls),
    path('time/', views.time),    # 添加對應的路徑
]

三、啓動Django服務

能夠看到顯示的是當前數據，從新刷新，數據就會變化。瀏覽器

經過上面例子，已經建立好了一個小小的動態頁面，固然此次要說的不單單是這樣，是須要用戶的數據交互，經過用戶輸入的內容，並返回給用戶post

接收並返回數據

當咱們登陸博客的時候，博客都會返回給咱們一個用戶名，而這個用戶名是本身設置的，這裏安靜寫一個簡單的登陸網站，網站直接返回登陸的名稱網站

一、編寫登陸頁面HTML，添加路徑渲染，添加視圖返回

在templates目錄下建立一個login.html（這個頁面爲登陸頁面）ui

# login.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>登陸</title>
</head>
<body>
    <h1>
        <p style="text-align:center" font size="2">歡迎來到安靜的博客：</p>


    </h1>
    <h1>
        <p style="text-align:center">請輸出帳號密碼：</p>
    </h1>
    <form action="/index/" method="post"><p style="text-align:center">用戶：<input type="text" name="username" /><br />
        </p>
        <p style="text-align:center">密碼：<input type="password" name="password" /><br />
        <input type="submit" value="提交" />
    </form>

</body>
</html>

在templates目錄下建立一個index.html文件（登陸後跳轉的頁面）url

<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<head>
    <title>安靜博客樂園</title>
</head>
<body>
<center>
    <li>歡迎您：  
    </li>
</center>
</ul>
</body>
</html>

在urls.py文件中添加對應的路徑，而後啓動服務，在瀏覽器中輸入對應的路徑查看spa

# urls.py

from django.contrib import admin
from django.urls import path
from Anjing import views
urlpatterns = [
    path('admin/', admin.site.urls),
    path('login/', views.login),
    path('index/', views.index),
]

在views.py文件中添加視圖返回內容3d

# views。py

from django.shortcuts import render

def index(request):
    if  request.method == 'POST':
        username = request.POST.get('username')
        password = request.POST.get('password')
        return render(request, 'index.html')

所有工做都準備完成了，而後啓動服務，打開瀏覽器，查看咱們的頁面渲染code

咱們在輸入框內隨便輸入用戶信息點擊提交

發現出現了403，什麼狀況，咱們上面已經對頁面進行了渲染，應該不會出錯哈。

你們不要着急，其實這個是正常的，這個屬於Djaongo有一個跨站請求保護的機制，咱們能夠從報錯中發現須要咱們加入 {% csrf_token %}

# login.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>首頁</title>
</head>
<body>
    <h1>
        <p style="text-align:center" font size="2">歡迎來到安靜的博客：</p>
    </h1>
    <h1>
        <p style="text-align:center">請輸出帳號密碼：</p>
    </h1>
    <form action="/index/" method="post">
        {% csrf_token %}
        <p style="text-align:center">用戶：<input type="text" name="username" /><br />
        </p>
        <p style="text-align:center">密碼：<input type="password" name="password" /><br />
        <input type="submit" value="提交" />
    </form>
</body>
</html>

固然了咱們也要在返回的頁面加入一些參數和修視圖中的代碼

# index.html

<html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<head>
    <title>安靜博客樂園</title>
</head>
<body>
<center>
    <li>歡迎您，
        <tbody>
                <tr>
                    <td>{{data}}</td>
                </tr>
            </tbody>
    </li>
</center>
</ul>
</body>
</html>

修改views.py視圖文件

# views.py

from django.shortcuts import render
from django.http import HttpResponse

def index(request):
    if  request.method == 'POST':
        username = request.POST.get('username')
        password = request.POST.get('password')
        return render(request, 'index.html', {'data':username})