BVDN-4 用户注册登录
所有网站几乎都有一个最基本的功能:注册和登录(废话!)。所以我们建完网站后,第一件事要加上去的功能也是登录和注册。
Django-users2
登录和注册这么基本的东西,django里面当然也有。但是我们不用,我们用别人已经最好的django-users2这个包,这样我们需要做的事情就更少了。记住,工程师思维,能用别人的,就不要自己造。
百度搜索“pypi django-users2”。把这个包下载下来
![](https://zqxt.oss-cn-beijing.aliyuncs.com/upload_images/7158703-e8a2f24f9f96426c.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/700)
点击右侧原谅色按钮,下载tar.gz包,然后解压,你会发现里面有个users文件夹,这就是我们想要的东西
而今迈步从头越
我们这次重新建一个项目(怎么又重建……),django-admin startproject,然后把刚才解压出来的users文件夹复制进去。
![](http://zqxt.oss-cn-beijing.aliyuncs.com/upload_images/7158703-2a39bfe782beedd2.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/310)
这些操作重复了一遍又一遍,不要烦!重复才能学会。接下来,在内层主文件夹里的settings.py里的INSTALLED_APPS列表里注册用户账户系统users(否则不能用)
![](http://zqxt.oss-cn-beijing.aliyuncs.com/upload_images/7158703-7cd3b241d6cbd3f2.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/353)
千万不要忘记底下那一行AUTH_USER_MODEL = ,那是把django的user模型换成users包里面的用户模型。不换的话users虽然安装成功了,依然用的是原版django用户模型。那就白干了。
migrate
接下来,用python manage.py migrate更新用户模型
![](http://zqxt.oss-cn-beijing.aliyuncs.com/upload_images/7158703-f0dc40bc6691523f.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/566)
并创建超级管理员
![](http://zqxt.oss-cn-beijing.aliyuncs.com/upload_images/7158703-fe1a1539fe4137c8.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/563)
这些都完成之后,我们runserver,访问127.0.0.1:8000/admin,登录进去
![](http://zqxt.oss-cn-beijing.aliyuncs.com/upload_images/7158703-a2a2a38078d6abdc.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/700)
进去找到user模型,点开它。如果出现如下画面(只有邮箱和active两列),说明我们的user模型替换成功了,如果还有first name, last name等其他列,说明替换失败,退回去重做!
![](http://zqxt.oss-cn-beijing.aliyuncs.com/upload_images/7158703-1b590f3b94293087.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/700)
更改新的user模型
虽然我们替换成功,但是一个用户账户只有email一个信息绝对是不够用的,所以我们要向现在的user模型里扩充其他东西。也就是说我们要更改新的user模型
![](http://zqxt.oss-cn-beijing.aliyuncs.com/upload_images/7158703-25ad1cd6d187e5ff.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/637)
找到users文件夹里的models.py打开它,找到现在还是空着的User模型(一般在最底下),如图
![](http://zqxt.oss-cn-beijing.aliyuncs.com/upload_images/7158703-3867241f29bf7faa.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/485)
加入你想要的模型,如图
![](http://zqxt.oss-cn-beijing.aliyuncs.com/upload_images/7158703-5158a4d71549d0d0.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/700)
以后的model都这样修改和添加。做完这些之后,我们再次更新数据库(注意操作不一样)首先python manage.py makemigrations
然后再python manage.py migrate,如图
![](http://zqxt.oss-cn-beijing.aliyuncs.com/upload_images/7158703-42ddb0e714cd53d4.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/623)
这些都做完以后,我们再为user模型添一些小功能,如从生日导出年龄,如图所示
![](http://zqxt.oss-cn-beijing.aliyuncs.com/upload_images/7158703-e3496e78fe16ebd9.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/509)
为了实现age方法,写出birthday_filter函数
![](http://zqxt.oss-cn-beijing.aliyuncs.com/upload_images/7158703-a99c79f714b2315f.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/700)
最后,打开admin.py找到class UserAdmin(BaseUserAdmin):,作如下修改(注意上面的fields和下面的list_display)
![](http://zqxt.oss-cn-beijing.aliyuncs.com/upload_images/7158703-f89acd2a8cf61f79.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/700)
这些都改过以后,runserver,再次访问到User,会发现有变化
![](http://zqxt.oss-cn-beijing.aliyuncs.com/upload_images/7158703-0d98c8eb4cadae03.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/700)
这样的User模型,是不是不那么简陋了?是不是能用了?
通过上面的修改,我们有了可以实际应用的User模型,现在我们需要在主页上加入注册登录入口和登出按钮。
还记得Base.html吗?
第二节编的base.html,不要删除。现在它该再次出场了。
startapp main,再重复一遍,把base.html和static复制进来
![](https://zqxt.oss-cn-beijing.aliyuncs.com/upload_images/7158703-72069ee82bd4fd2e.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/279)
在views.py里添加响应函数
![](http://zqxt.oss-cn-beijing.aliyuncs.com/upload_images/7158703-e7bef5efce605844.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/354)
在settings.py里注册main应用
![](http://zqxt.oss-cn-beijing.aliyuncs.com/upload_images/7158703-96fbb0ed4edf78f7.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/386)
在urls.py里添加地址
![](http://zqxt.oss-cn-beijing.aliyuncs.com/upload_images/7158703-bd8a91ae0fdabe12.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/394)
runserver,确保能访问到我们的主页
![](http://zqxt.oss-cn-beijing.aliyuncs.com/upload_images/7158703-565b593cb8f5cc88.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/700)
为什么我们看到了这玩意?原来在users文件夹里也有一个base.html!我们得改名。
![](http://zqxt.oss-cn-beijing.aliyuncs.com/upload_images/7158703-1456cbafa4fc818d.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/474)
所以说名字一定要起长一些,避免重名,编程的时候最烦的就是和关键字重名。
![](http://zqxt.oss-cn-beijing.aliyuncs.com/upload_images/7158703-cedc64c821c312b3.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/384)
![](http://zqxt.oss-cn-beijing.aliyuncs.com/upload_images/7158703-0955aaceeb0659ae.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/494)
改完名后,就可以正常访问主页了
![](http://zqxt.oss-cn-beijing.aliyuncs.com/upload_images/7158703-c829334e5fed41f9.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/557)
接下来,就该修改我们的主页了
修改主页
找到改名之后的basemain.html,打开它,找到导航栏
![](http://zqxt.oss-cn-beijing.aliyuncs.com/upload_images/7158703-fdeab5c25ff5564a.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/659)
修改成这样
![](http://zqxt.oss-cn-beijing.aliyuncs.com/upload_images/7158703-54f33100f84ecd0e.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/700)
很多内容看不懂?别急,容我慢慢讲来:
首先,这是Bootstrap导航栏修改的教程:http://www.runoob.com/bootstrap/bootstrap-navbar.html,那些class=“”应该怎么写,请自己去看,我就不讲了,我讲重点。
注意看代码中间段的{% if ... %},这个是Django模板,它代表的是Django后台往前端送网页文件之前,对网页文件进行的一些加工。
比如说这里的{% if request. user. is_ authen ticated %},仔细看,结合上下文可以判断出,它是用来判断当前是不是有人登录,如果有人登录就显示个人中心,如果未登录就显示登录、注册按钮。
然后注意{{ request.user.name }},这个也是Django模板,但是它的作用是传递数据。也就是说Django后台往前端送网页之前会先把这个双括号换成request.user.name,也就是当前登录用户的名字。
在我们详细介绍Vue和Ajax之前,这就是我们传递数据的唯一方式了。好好使用哦!好嘞,我们首页改完了,现在可以试试看效果
![](http://zqxt.oss-cn-beijing.aliyuncs.com/upload_images/7158703-8283bd4af72ae52c.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/437)
但是,点击了登录按钮后,好像没有反应……那是当然的了,你还没有加入超链接。这部分内容我们下次再讲。
BVDN,傻子也能建网站。