临近年底,各种忙,好久没更新博客了,2017春节假期在即,距下班还有2小时,难得闲下来,来撸一手django简单的web注册,登录,注销。


 环   境:centos 6.4 64bit

 python :python 2.7.8

 django :1.9.6

 author:soul

 date  :2017-01-24



1、创建一个项目project  名为sheying


  #django-admin startproject sheying


2、创建一个项目应用app  名为danfan


  #python manage.py startapp danfan


3、创建一个模板目录,存放html展示页面


  在danfan目录下mkdir templeates


4、设置项目sheying 的settings参数


添加app应用以及模板路径,数据库链接

TEMPLATE_DIRS = (

    '/usr/local/python27/sheying/danfan/templeates',

)

INSTALLED_APPS = (

    #添加app

    'danfan', 

)           

MIDDLEWARE_CLASSES中添加中文支持,注释安全检测

'django.middleware.locale.LocaleMiddleware',  

    #'django.middleware.csrf.CsrfViewMiddleware',


DATABASES = {

    'default': {

        'ENGINE': 'django.db.backends.mysql',           //这里用的是mysql

        'NAME': 'sheying',    //数据库名

        'USER': 'soul',       //用户名

        'PASSWORD': 'password',//密码

        'HOST': '127.0.0.1',

        'PORT': '3306',

    }

}



5、在danfan目录下定义数据模型models(User,Info)

User: 用于存在用户注册的用户数据

Info:用于存在图片的信息详细。


      models.py

# -*-coding:utf-8 -*-

from django.db import models


class User(models.Model):

      username = models.CharField('用户名',max_length=32)

      password = models.CharField('密码',max_length=32)

      email = models.EmailField('邮箱')


      def __unicode__(self):

            return self.username


class Info(models.Model):

      BRAND_CHOICES = (

            ('Canon', 'Canon'),

            ('Nikon', 'Nikon'),

            ('Sony', 'Sony'),)


      TYPE_CHOICES = (

            ('风景', '风景'),

            ('人像', '人像'),

            ('写真', '写真'),)


      title = models.CharField('标题',max_length=64)

      type = models.CharField('类型',choices=TYPE_CHOICES, max_length=16, default = '风景')

      author = models.CharField('摄影师',max_length=32)

      place = models.CharField('拍摄场所',max_length=64)

      brand = models.CharField('品牌',choices=BRAND_CHOICES, max_length=16,default='Nikon')

      model = models.CharField('型号',max_length=16)

      scene = models.CharField('镜头',max_length=64)

      description = models.TextField('描述',blank=True, null=True)


      def __unicode__(self):

            return self.title


定义表单 forms.py   (用于注册和登录信息框输入)

# -*-coding:utf-8 -*-

from django import forms


class UserForm(forms.Form):

        username = forms.CharField(label='账号:',max_length=16, error_messages={'required': '请填写您的称呼','max_length': '称呼太长'})

        password = forms.CharField(label='密码:',widget=forms.PasswordInput(),error_messages={'required': '请填写密码'})

        email = forms.EmailField(label='邮箱:',error_messages={ 'required': '请输入你的邮箱','invalid': '邮箱格式不正确'})

class LoginForm(forms.Form):

    username = forms.CharField(label='账号:',max_length=16, error_messages={'required': '请输入用户名','max_length':'用户名太长'})

    password = forms.CharField(label='密码:',widget=forms.PasswordInput(),error_messages={'required': '请输入密码'})



6、同步数据,生成数据表和表单(1.7以上版本)

#python manage.py syncdb

# python manage.py makemigrations

# python manage.py migrate

(创建管理员账号过程略......)


7、创建视图(danfan目录下的views.py


#coding=utf-8

from django.shortcuts import render

from forms import UserForm

from forms import LoginForm

from django.shortcuts import render_to_response

from django.http import HttpResponse,HttpResponseRedirect

from django.template import RequestContext

from .models import User,Info

#注册用户

def register(request):

    if request.method == "POST":

        uf = UserForm(request.POST)

        if uf.is_valid():

            username = uf.cleaned_data['username']

            password = uf.cleaned_data['password']

            email = uf.cleaned_data['email']

            User.objects.create(username= username,password=password,email=email)

            return render_to_response('success.html',{'username':username})

    else:

        uf = UserForm()

    return render_to_response('register.html',{'uf': uf})


#登录账号

def login(request):

        if request.method == "POST":

                uf = LoginForm(request.POST)

                if uf.is_valid():

                         username = uf.cleaned_data['username']

                         password = uf.cleaned_data['password']

                         user = User.objects.filter(username__exact =  \                                              username,password__exact = password)

                         if user:

                                response = HttpResponseRedirect('/danfan/add')

                                response.set_cookie('username',username,3600)

                                return response

                         else:

                                return HttpResponseRedirect('/danfan/login')

        else:

                uf = LoginForm()


        return render_to_response('login.html',{'uf': uf})

#添加图片分享

def add(request):

        if request.method == 'GET':

                return render(request,'add.html')

        elif request.method == 'POST':

                title = request.POST['title']

                type = request.POST['type']

                author = request.POST.get('author', '')

                place = request.POST.get('place', '')

                brand = request.POST['brand']

                model = request.POST.get('model', '')

                scene = request.POST.get('scene', '')

                description = request.POST.get('description', '')

                info = Info.objects.filter(title=title)

                if info:

                        return HttpResponse('Title %s have been exist' % title)

                info = Info(title=title, type=type, author=author, place=place,                             brand=brand, model=model, scene=scene, description=description)

                info.save()

                #return HttpResponse('Add title %s success' % title) 

                return HttpResponseRedirect('/danfan/list')

        else:

                return HttpResponse('Not support method %s' % request.method)


#list列表

def list(request):

        #article = Article.objects.get(id=id)

        #self_infos = Info.objects.filter(Info=id).order_by("-id").all()        

        self_infos = Info.objects.order_by("-id").all()

        return render_to_response('index.html', {'self_infos': self_infos})


#注销

def logout(request):

    #response = HttpResponse('logout')

    #response.delete_cookie('username')

    #return response

        return HttpResponseRedirect('/danfan/login')


8、配置url路径


项目sheying 下urls.py

from django.conf.urls import patterns, include, url

from django.contrib import admin

admin.autodiscover()

urlpatterns = patterns('',

    url(r'^admin/', include(admin.site.urls)),

    url(r'^danfan/', include('danfan.urls')),    //将danfan目录路径include进来

)


应用danfan下的urls.py


from django.conf.urls import patterns, url

from danfan import views


urlpatterns = patterns('',

           url(r'^$',views.register, name='register'),

           url(r'^register/$',views.register,name = 'register'),

           url(r'^login/$',views.login,name = 'login'),

           url(r'^add/$',views.add,name = 'add'),

           url(r'^list/$',views.list,name='list'),

           url(r'^logout/$',views.logout,name = 'logout'),


register:注册页面url

login:  登录页面url

add:     添加页面url

list:   列表页面url

logout: 注销页面url


9、创建html模板(存放在templeates目录下)


register.html 注册页面

<!DOCTYPE html>

<html>

<head>

<title>小蜜蜂</title>

<link href="http://libs.baidu.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">

<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>

<script src="http://libs.baidu.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>

</head>     

    <style type="text/css">

       body{background:#efd;padding:100 5em;margin:10;

            background-p_w_picpath="/usr/local/python27/cenxi/hunlianwang/templeates/p_w_picpaths/index.jpg";

            background-size:cover;

        }     

       h1{padding:2em 0.5em;background:#687}

       h2{color:#bf8;border-top:1px dotted #fff;margin-top:2em}

       p{margin:1em 0}

    </style>

<body>

<button type="button" class="btn btn-default">首页</button>

<button type="button" class="btn btn-primary">相约小蜜蜂</button>

<button type="button" class="btn btn-success">美图分享</button>

<button type="button" class="btn btn-info">摄影之旅</button>

<button type="button" class="btn btn-warning">拍摄技巧</button>

<button type="button" class="btn btn-danger">关于我们</button>

<br>

    <div>

        <form method = 'post' enctype="multipart/form-data">

        {% csrf_token %}

        `uf`.`as_p`

        <input class="btn btn-warning" type="submit" value = "注册用户" />

        <a href="/danfan/login/" color='#bf8'> 登录 </a>

        </form>

    </div>

</body>

</html>



   login.html 登录页面  

(这里只简写body部分,head title等直接继承beas.html即可)

<html>

<body>

        <div>

        <form method = 'post' enctype="multipart/form-data">

        {% csrf_token %}

        `uf`.`as_p`

        <input class= "btn btn-success" type="submit" value = "登陆" >

        </form>

        </div>

</body>

</html>

添加图片信息页面add.html  

(这里只简写body部分,head title等直接继承beas.html即可)

<html>

<body>

 <div>

        <H3>分享我的照片</H3>

        <br />

        <form action="" method="post">

                {% csrf_token %}

                <div>

                        <label for="title">标题:</label>

                        <input name="title" id="title">

                </div>

                <br />

                <div>

                        <label for="type">类型:</label>

                        <select name="type" id="type">

                                <option value="风景">风景</option>

                                <option value="人像">人像</option>

                                <option value="写真">写真</option>

                        </select>

                        

                </div>

                <br />

                <div>

                        <label for="author">摄影:</label>

                        <input name="author" id="author">

                </div>

                <br />

                <div>

                        <label for="place">场地:</label>

                        <input name="place" id="place">

                </div>

                <br />

                <div>

                        <label for="brand">品牌:</label>

                        <select name="brand" id="brand">

                                <option value="Canon">Canon</option>

                                <option value="Nikon">Nikon</option>

                                <option value="Sony">Sony</option>

                        </select>

                </div>

                <br />

                <div>

                        <label for="model">型号:</label>

                        <input name="model" id="model">

                </div>

                <br />

                

                <div>

                        <label for="scene">镜头:</label>

                        <input name="scene" id="scene">

                </div>

                <br>

                <div>

                        <label for="description">描述:</label>

                        <textarea name="description" cols="22" rows="5"></textarea>

                </div>

                <br>

                <div>

                        <input class="btn btn-success" type="submit" value="保存">

                </div>

                </form>

</body>

</html>


列表页面 list.html

(这里只简写body部分,head title等直接继承beas.html即可)

<html>

<body>

        <div>

        <H3>我的图片分享</H3>

        <br />

        <table color="CCCC33" width="800" border="0" cellpadding="5" >

                <tr>

                        <td><h4>标题 </h4></td>

                        <td><h4>类型 </h4></td>

                        <td><h4>摄影 </h4></td>

                        <td><h4>场地 </h4></td>

                        <td><h4>品牌 </h4></td>

                        <td><h4>型号 </h4></td>

                        <td><h4>镜头 </h4></td>

                        <td><h4>描述 </h4></td>

                        <td colspan="2"><h4>操作 </h4></td>

                </tr>

                {% for info in self_infos %}

                <tr>

                        <td><h5>`info`.`title`</h5></td>

                        <td><h5>`info`.`type`</h5></td>

                        <td><h5>`info`.`author`</h5></td>

                        <td><h5>`info`.`place`</h5></td>

                        <td><h5>`info`.`brand`</h5></td>

                        <td><h5>`info`.`model`</h5></td>

                        <td><h5>`info`.`scene`</h5></td>

                        <td><h5>`info`.`description`</h5></td>

                        <td><h5><a href="` info`.`id `/">详情</a></h5></td>

                        <td><h5><a href="` info`.`id `/delete/">删除</a></h5></td>

                       

                 </tr>

                {% endfor%}

        </table>


                        <br />

                        <br />

                         <a href="/danfan/logout/" color='#bf8'>退出 </a>


</body>

</html>




访问测试

A:访问http://192.168.101.52:6666/danfan


wKioL1iHGSCgm5ZfAABzdPZf8hs905.png-wh_50

不填写用户信息会有一个判断

wKiom1iHGVeSXIVsAACGaZEXgaM073.png-wh_50


注册一个小茗同学 的账户 

wKioL1iHGYCTVEipAACTY-5Kc1U878.png-wh_50

注册成功,添加分享的图片信息

wKioL1iHGarSGeQOAACwG7pC59s328.png-wh_50


保存信息内容

wKiom1iHGdOTxkRuAADMB6v60Kw384.png-wh_50


先写到这里了,还有图片上传、详情、评论、删除等功能需要优化。

j_0006.gif春节放假咯,回去继续啃书.......在技术控的路上渐行渐远.大家新年快乐!