判断用户是否登录

效果图

当用户未登录时，逻辑上是不允许访问某些页面的。比如用户中心页面。因此就需要对某些页面做登录验证，而Django封装了这个方法。

用户中心前端页面：

用户中心
    

        

            

                
当前登录用户：
                
{{ request.user.username }}
                
退出
                
用户中心
            
        
        
基本信息
        

            

                
用户名
                
联系方式
                
邮箱
            
            

                
[[ username ]]
                
[[ mobile ]]
                

                    
                    
                    
                    邮箱格式错误
                
                

                    
                    已验证
                    待验证
                    
                
            
        
    

对应于此页面的VUE：

var vm = new Vue({
    el:'#app',
    delimiters:['[[', ']]'],
    data:{
        host:host,
        username:username,
        mobile:mobile,
        email:email,
        email_active:email_active,
        set_email:false,
        error_email:false,
        error_email_message:'',
        send_email_btn_disabled:false,
        send_email_tip:'重新发送邮件',
    },
    mounted(){},
    methods:{
        // 检查email格式
        check_email(){
            // 匹配正则
            var re = /^[a-z0-9][\w\.\-]*@[a-z0-9\-]+(\.[a-z]{2,5}){1,2}$/;
            if(re.test(this.email)){
                this.error_email = false;
            }
            else{
                this.error_email_message = '邮箱格式错误';
                this.error_email = true;
                return;
            }
        },
        // 保存email
        save_email(){
            // 检查email格式
            this.check_email();
            if(this.error_email == false){
                var url = this.host + '/emails/';
                axios.put(url, {
                    email:this.email
                }, {
                    headers:{
                        'X-CSRFToken':getCookie('csrftoken')
                    },
                    responseType:'json'
                }).then(response=>{
                    if(response.data.code == '0'){
                        this.set_email = false;
                        this.send_email_btn_disabled = true;
                        this.send_email_tip = '已发送验证邮件';
                    }
                    else if(response.data.code == '4101'){
                        location.href = '/login/?next=/info/';
                    }
                    else{
                        this.error_email_message = response.data.errmsg;
                        this.error_email = true;
                    }
                }).catch(error=>{
                    console.log(error.response)
                });
            }
        },
        // 取消保存email
        cancel_email(){
            this.email = '';
            this.error_email = false;
        },
    }
});

从视图函数接收变量：

let username = "{{ username }}";
let mobile = "{{ mobile }}";
let email = "{{ email }}";
let email_active = "{{ email_active }}";

工具js：

// 获取cokie
function getCookie(name){
    var r = document.cookie.match("\\b" + name + "=([^;]*)\\b");
    return r ? r[1] : undefined;
}

视图函数：

class UserInfoView(LoginRequiredMixin, View):
    def get(self, request):
        return render(request, 'user_center_info.html')

Django的LoginRequiredMixin类中封装了验证用户登录的代码，可以直接使用。
原始代码为：

# 判断是否登录
if request.user.is_authenticated:
    # 已登录
    return render(request, 'user_center_info.html')
else:
    # 未登录
    return redirect('/login/')

还需要在配置文件中指定被拦截之后重定向的页面：

LOGIN_URL = '/login/'

登录之后返回刚才浏览的页面：

在VUE中有这样一段代码：

location.href = '/login/?next=/info/';

这里指定了登录之后，重定向的页面是“info”。

所以在登录的视图函数接收一下这个参数，重定向的页面改一下就可以了。

# 接收重定向参数
next_url = request.GET.get('next', '/')
# 有两个参数，如果有next这个参数，则返回next指定的页面，若没有，则返回“/”
...
response = redirect(next_url)
response.set_cookie('username', user.username, max_age=60 * 60 * 24 * 14)
return response

源码