一个登录页面的实现

自己比较笨，一个登录界面搞了半天，终于有了点眉目，现在记录下来，免得自己过段时间又忘了。

先说下软件配置，python 3.3，django 1.6， bootstrap 3

一个登录页面的模板login.html，一个登录后要跳转的页面main.html

app下的urls.py:

1 from django.conf.urls import patterns, url, include
2 from .views import login_view,main_view
3 
4 urlpatterns = patterns('',
5         url(r'^login/$', login_view,name='login'),
6         url(r'^main/$', main_view,name='main'),
7     )

app下的表单文件forms.py ：

 1 from django import forms
 2 
 3 class LoginForm(forms.Form):
 4     username = forms.CharField(required=True,
 5             label='',
 6             max_length=12,
 7             error_messages={'required':'请输入用户名'},
 8             widget=forms.TextInput(
 9                 attrs={'placeholder':'用户名',
10                        'class':'form-control'}))
11     password = forms.CharField(required=True,
12             label='',
13             max_length=12,
14             min_length=6,
15             error_messages={'required':'请输入密码'},
16             widget=forms.PasswordInput(
17                 attrs={'placeholder':'密码',
18                        'class':'form-control'}))
19     
20     def clean(self):
21         if not self.is_valid():
22             raise forms.ValidationError('用户名和密码为必填项')
23         else:
24             cleaned_data = super().clean()

app下的views.py:

 1 from django.shortcuts import render_to_response,redirect,render
 2 from django.template import RequestContext
 3 from django.contrib import auth
 4 from django.contrib.auth.decorators import login_required
 5 
 6 from .forms import LoginForm
 7 
 8 def login_view(request):
 9     if request.method == 'GET':  
10         form = LoginForm(auto_id=False)  
11         return render_to_response('game/login.html',
12                 RequestContext(request, {'form': form,}))
13     else:  
14         form = LoginForm(request.POST)  
15         if form.is_valid():  
16             username = request.POST.get('username', '')  
17             password = request.POST.get('password', '')  
18             user = auth.authenticate(username=username,
19                                      password=password)  
20             if user is not None and user.is_active:  
21                 auth.login(request, user)  
22                 return redirect('/game/main/')
23             else:  
24                 return render_to_response('game/login.html',
25                     RequestContext(request, 
26                         {'form': form,'password_is_wrong':True}))  
27         else:  
28             return render_to_response('game/login.html',
29                     RequestContext(request, {'form': form,}))  
30 
31 @login_required(login_url='/game/login/')
32 def main_view(request):
33     return render(request, 'game/main.html', {'user':request.user})

这两天一直在折腾登录，一开始不加@login_required时可以正常跳转到登录后的页面，但是一旦加了@login_required后，就不能正常工作，百思不得其解，经过多番尝试，终于理解了问题发生的原因，在login_view函数里，auth.login(request,user)的后面一句不能写成return render或render_to_response，因为登录成功后会因为render直接显示main.html这个页面，根本就没有跳转到main_view视图函数，因此在登录语句后应该写成跳转的形式。

登录模板使用了bootstrap的样式

 1 <!DOCTYPE html>
 2 <html lang="en">
 3   <head>
 4     <meta charset="utf-8">
 5     <meta http-equiv="X-UA-Compatible" content="IE=edge">
 6     <meta name="viewport" content="width=device-width, initial-scale=1">
 7     <meta name="description" content="">
 8     <meta name="author" content="">
 9 <!--     <link rel="shortcut icon" href="../../assets/ico/favicon.ico"> -->
10 
11     <title>系统登录</title>
12 
13     <!-- Bootstrap core CSS -->
14     <link href="/static/css/bootstrap.css" rel="stylesheet">
15 
16     <!-- Custom styles for this template -->
17     <link href="/static/css/signin.css" rel="stylesheet">
18 
19     <!-- Just for debugging purposes. Don't actually copy this line! -->
20     <!--[if lt IE 9]><script src="../../assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
21 
22     <!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
23     <!--[if lt IE 9]>
24       <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
25       <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
26     <![endif]-->
27   </head>
28 
29   <body>
30       {% if password_is_wrong %}  
31         <div class="alert alert-error">    
32             <h4>错误!</h4>用户名或密码错误  
33         </div>  
34          {% endif %} 
35     <div class="container">
36 
37       <form class="form-signin" role="form" action="{% url 'game:login'  %}" method="post">
38       {% csrf_token %}
39         
40         <h2 class="form-signin-heading">请登录</h2>
41          {{ form.as_p }} 
42 <!--          <input type="hidden" name="next" value="{{ next }}" /> -->
43         <!-- <input type="text"  class="form-control" placeholder="请输入用户名" required autofocus>
44         <input type="password" class="form-control" placeholder="请输入密码" required> -->
45         <label class="checkbox">
46           <input type="checkbox" value="remember-me"> 记住我
47         </label>
48         <button class="btn btn-lg btn-primary btn-block" type="submit">登录</button>
49       </form>
50     </div> <!-- /container -->
51 
52 
53     <!-- Bootstrap core JavaScript
54     ================================================== -->
55     <!-- Placed at the end of the document so the pages load faster -->
56   </body>
57 </html>

登录后的main.html页面：

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4 <meta charset="UTF-8">
 5 <title>Insert title here</title>
 6 </head>
 7 <body>
 8 {% if user.is_authenticated %}
 9     {{ user.username }} Successful
10 {% else %}
11     Failed
12 {% endif %} 
13 </body>
14 </html>

后面随时会进行修改和完善