首页 > Web开发 > 详细

WEB框架之-Django入门

时间:2019-08-05 14:32:20      阅读:173      评论:0      收藏:0      [点我收藏+]

安装Django

pip3 install diango

安装好之后, python安装目录下的Scripts目录下会有:django-admin.exe

技术分享图片

 

添加 C:\Program Files\Python36\Scripts 到环境变量path中

 

创建project

技术分享图片

注意:如上所示,如果不切换指定目录,则会在当前目录C:\Users\Administrator下创建名为mysite的工程

 

创建成功后,会在C:\Program Files\Python36\Scripts目录下生成一个mysite目录,mysite目录结构如下:

mysite
        -mysite
                -__init__.py
                -settings.py      #配置文件
                -urls.py          #url对应关系
                -wsgi.py          #遵循WSGI规范,实际用uwsig+nginx
        -manage.py                #管理Django规范,这里可以执行:
                                            --python manage.py
                                            --python manage.py start xx
                                            --python manage.py makemigrations
                                            --python manage.py migrate

 

启动django工程

通过python manage.py runserver 就可以启动上述创建的mysite,这里也可以加参数 127.0.0.1:8001,这样就能定义启动的端口,启动过程如下:

技术分享图片

 

然后登陆http://127.0.0.1:8000/

技术分享图片

 

也可以通过Pycharm创建Django工程,步骤如下:

 技术分享图片

技术分享图片

 

Pycharm启动Django工程,步骤如下:

也可以先指定端口

技术分享图片

技术分享图片

 

启动Django工程

技术分享图片

 

创建app

python manage.py startapp app名称

技术分享图片

 

也可以在pycharm的console中去创建

创建完后生成如下的目录结构:

技术分享图片

 

在views.py里添加如下代码:

from django.shortcuts import HttpResponse

def home(request):
    return HttpResponse(<h1>CMDB</h1>)

同时在mysite目录下urls.py里添加如下:

from cmdb import views

urlpatterns = [
    path(admin/, admin.site.urls),
    path(ab.html/, views.home),
]

 

登录成功界面显示如下:

技术分享图片

 

关于app目录的解释:

migrations   存放修改表结构时的记录

admin.py   Django为我们提供的后台管理

apps.py      配置当前app

models.py    ORM,写指定的类 通过命令就可以创建数据库结构

tests.py     用于做单元测试

views.py      业务代码

 

 

写一个简单的例子

首先注释掉settings.py配置文件中的一行内容:

技术分享图片

 

在cmdb下的views.py里写如下代码:

from django.shortcuts import render

def login(request):
    return render(request,login.html)

可以把login.html文件放到templates目录下

这里的login.html文件不用指定绝对路径,只需要在settings.py配置文件中配置一下路径即可:

技术分享图片

在mysite目录下的urls.py写如下代码:

from cmdb import views
urlpatterns = [
    path(admin/, admin.site.urls),
    path(login/, views.login),
]

 

整个目录如下:

技术分享图片

登录效果如下:

技术分享图片

 

关于静态文件的存放

 目录结构如下:

技术分享图片

 

将css以及js放在一个static目录下

login.html代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="/static/common.css" />
    <style>
        label{
            width: 80px;
            text-align: right;
            display: inline-block;
        }
    </style>
</head>
<body>
    <form action="/login/" method="post">
        <p>
            <label for="username">用户名:</label>
            <input id="username" type="text" />
        </p>
        <p>
            <label for="password">密码:</label>
            <input id="password" type="text" />
            <input type="submit" value="提交" />
        </p>
    </form>
    <script src="/static/jquery-1.12.4.js"></script>
</body>
</html>

 

static目录下common.css文件中配置样式:

body{
    background-color: darkgray;
}

 

settings.py配置文件中的配置:

STATIC_URL = /static/
STATICFILES_DIRS = (
    os.path.join(BASE_DIR, static),    #这是一个元组,所以逗号一定要加,不加Django就启动不了
)

 

效果图如下:

技术分享图片

 

获取用户的信息

技术分享图片

 

views.py中的代码如下:

from django.shortcuts import render
from django.shortcuts import redirect

def login(request):
    print(request.method)
    error_msg= ""
    if request.method == "POST":
        user = request.POST.get("user",None)
        pwd = request.POST.get("pwd",None)
        print(user,pwd)
        if user == "root" and pwd == "123":
            return redirect(http://www.baidu.com)
        else:
            error_msg = "用户名或密码错误"
    return render(request,login.html,{error_msg:error_msg})

 

login.html代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="/static/common.css" />
    <style>
        label{
            width: 80px;
            text-align: right;
            display: inline-block;
        }
    </style>
</head>
<body>
    <form action="/login/" method="post">
        <p>
            <label for="username">用户名:</label>
            <input id="username" name="user" type="text" />
        </p>
        <p>
            <label for="password">密码:</label>
            <input id="password" name="pwd" type="text" />
            <input type="submit" value="提交" />
            <span style="color: red;">{{ error_msg }}</span>
        </p>
    </form>
    <script src="/static/jquery-1.12.4.js"></script>
</body>
</html>

 

效果如下:

如果输入的用户名或密码不匹配,则

 技术分享图片

如果正确,则会跳转到百度。

 

下面是一个完整的例子

 技术分享图片

 

views.py中的代码如下:

from django.shortcuts import render
from django.shortcuts import redirect

def login(request):
    print(request.method)
    error_msg= ""
    if request.method == "POST":
        user = request.POST.get("user",None)
        pwd = request.POST.get("pwd",None)
        print(user,pwd)
        if user == "root" and pwd == "123":
            return redirect(/home)
        else:
            error_msg = "用户名或密码错误"
    return render(request,login.html,{error_msg:error_msg})


USER_LIST =[
    {"username":"tom","gender":"","email":"tom@163.com",},
    {"username":"jack","gender":"","email":"jack@126.com",},
    {"username":"lucy","gender":"","email":"lucy@163.com",}
]

def home(request):
    if request.method == "POST":
        u = request.POST.get(username)
        g = request.POST.get(gender)
        e = request.POST.get(email)
        temp = {"username":u,"gender":g,"email":e}
        USER_LIST.append(temp)
    return render(request,home.html,{user_list:USER_LIST})

urls.py中的代码如下:

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

urlpatterns = [
    path(admin/, admin.site.urls),
    path(login/, views.login),
    path(home/, views.home),

]

home.html代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body style="margin: 0">

    <div style="height: 48px;background-color: #dddddd"></div>
    <div>
        <form action="/home/" method="POST">
            <input type="text" name="username" placeholder="用户名">
            <input type="text" name="gender" placeholder="性别">
            <input type="text" name="email" placeholder="邮箱">
            <input type="submit" value="添加">
        </form>
    </div>
    <div>
        <table border="1">
            <thead>
            <tr>
                <th>姓名</th>
                <th>性别</th>
                <th>邮箱</th>
            </tr>
            </thead>
            <tbody>
                {% for row in user_list %}
                    <tr>
                        <td>{{ row.username }}</td>
                        <td>{{ row.gender }}</td>
                        <td>{{ row.email }}</td>
                    </tr>
                {% endfor %}
            </tbody>
        </table>
    </div>
</body>
</html>

login.html的代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="/static/common.css" />
    <style>
        label{
            width: 80px;
            text-align: right;
            display: inline-block;
        }
    </style>
</head>
<body>
    <form action="/login/" method="post">
        <p>
            <label for="username">用户名:</label>
            <input id="username" name="user" type="text" />
        </p>
        <p>
            <label for="password">密码:</label>
            <input id="password" name="pwd" type="text" />
            <input type="submit" value="提交" />
            <span style="color: red;">{{ error_msg }}</span>
        </p>
    </form>
    <script src="/static/jquery-1.12.4.js"></script>
</body>
</html>

 

运行结果如下:

技术分享图片

输入正确的用户名和密码点击提交,跳转到home页面

技术分享图片

 

点击添加按钮可以添加新的数据:

技术分享图片

 

WEB框架之-Django入门

原文:https://www.cnblogs.com/cyfiy/p/9890496.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!