【Django开发】前后端分离django美多商城项目第7篇：登录,1. 互联开发者申请步骤【附代码文档】...

本教程的知识点为： 项目准备 项目准备 配置 1. 修改settings/dev.py 文件中的路径信息 2. INSTALLED_APPS 3. 数据库 用户部分 图片 1. 后端接口设计： 视图原型 2. 具体视图实现 用户部分 使用Celery完成发送 判断帐号是否存在 1. 判断用户名是否存在 后端接口设计： 用户部分 JWT 什么是JWT 起源 传统的session认证 用户部分 登录 1. 业务说明 2. 后端接口设计 3. 后端实现 登录 使用登录的流程 创建模型类 urllib使用说明 登录回调处理 登录 使用登录的流程 创建模型类 urllib使用说明 绑定用户身份接口 邮件与验证 学习目标： 业务说明： 技术说明： 保存邮箱并发送验证邮件 省市区地址查询 数据库建表 说明 页面静态化 注意 定时任务 安装 部分 详情页 异步任务的触发 。 后端接口设计 收货地址 使用缓存 安装 使用方法 为省市区视图添加缓存 数据库表设计 表结构 数据表结构 首页数据表结构 Docker使用 Docker简介 用户浏览历史记录 1. 保存 后端接口设计 后端实现 搜索 1. 需求分析 2. 搜索引擎原理 3. Elasticsearch 部分 业务需求分析 技术实现 数据存储设计 1. Redis保存已登录用户 商品部分 业务需求分析 技术实现 查询数据 1. 后端接口设计 部分 业务需求分析 技术实现 登录合并 修改登录视图 部分 保存 1. 后端接口设计 2. 后端实现 保存的思路 创建数据库模型类 接入 开发平台登录 沙箱环境 Xadmin 1. 安装 2. 使用 站点的全局配置 站点Model管理。 在Ubuntu中安装 2. 启动与停止 3. 镜像操作 端与自定义文件存储系统 1. 的Python客户端 安装 使用。

完整笔记资料代码： https://gitee.com/yinuo112/Backend/tree/master/Django/前后端分离django美多商城项目/note.md

感兴趣的小伙伴可以自取哦~

---

全套教程部分目录：

---

部分文件图片：

登录

登录开发文档

登录：即我们所说的第三方登录，是指用户可以不在本项目中输入密码，而直接通过第三方的验证，成功登录本项目。

1. 互联开发者申请步骤

若想实现登录，需要成为互联的开发者，审核通过才可实现。

• 相关连接：[

2. 互联应用申请步骤

成为互联开发者后，还需创建应用，即获取本项目对应与互联的应用ID。

• 相关连接：[

3. 网站对接登录步骤

互联提供有开发文档，帮助开发者实现登录。

• 相关连接：[

4. 登录流程分析

5. 知识要点

1. 当我们在对接第三方平台的接口时，一定要认真阅读第三方平台提供的文档。文档中一定会有接口的使用说明，方便我们开发。

定义登录模型类

登录成功后，我们需要将用户和美多商场用户关联到一起，方便下次登录时使用，所以我们选择使用MySQL数据库进行存储。

1. 定义模型类基类

为了给项目中模型类补充数据**创建时间和更新时间**两个字段，我们需要定义模型类基类。 在meiduo_mall.utils/models.py文件中创建模型类基类。

登录后复制

from django.db import models

class BaseModel(models.Model):
    """为模型类补充字段"""

    create_time = models.DateTimeField(auto_now_add=True, verbose_name="创建时间")
    update_time = models.DateTimeField(auto_now=True, verbose_name="更新时间")

    class Meta:
        abstract = True  # 说明是抽象模型类, 用于继承使用，数据库迁移时不会创建BaseModel的表

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.

2. 定义登录模型类

创建一个新的应用oauth，用来实现第三方认证登录。

登录后复制

  
  
# oauth
  
  
url(r'^oauth/', include('oauth.urls')),

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.

在oauth/models.py中定义身份（openid）与用户模型类User的关联关系

登录后复制

from django.db import models

from meiduo_mall.utils.models import BaseModel
  
  
# Create your models here.s
  
  


class OAuthUser(BaseModel):
    """登录用户数据"""
    user = models.ForeignKey('users.User', on_delete=models.CASCADE, verbose_name='用户')
    openid = models.C harField(max_length=64, verbose_name='openid', db_index=True)

    class Meta:
        db_table = 'tb_oauth_qq'
        verbose_name = '登录用户数据'
        verbose_name_plural = verbose_name

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.
• 11.
• 12.
• 13.
• 14.
• 15.
• 16.
• 17.
• 18.
• 19.

3. 迁移登录模型类

登录后复制

$ python manage.py makemigrations
$ python manage.py migrate

• 1.
• 2.

登录工具LoginTool

1. LoginTool介绍

• 该工具封装了登录时对接互联接口的请求操作。可用于快速实现登录。

2. LoginTool安装

登录后复制

pip install LoginTool

• 1.

3. LoginTool使用说明

1.导入

登录后复制

from LoginTool.tool import OAuth

• 1.

2.初始化OAuth对象

登录后复制

oauth = OAuth(client_id=settings._CLIENT_ID, client_secret=settings._CLIENT_SECRET, redirect_uri=settings._REDIRECT_URI, state=next)

• 1.

3.获取登录扫码页面，扫码后得到Authorization Code

登录后复制

login_url = oauth.get_qq_url()

• 1.

4.通过Authorization Code获取Access Token

登录后复制

access_token = oauth.get_access_token(code)

• 1.

5.通过Access Token获取OpenID

登录后复制

openid = oauth.get_open_id(access_token)

• 1.

OAuth2.0认证获取openid

待处理业务逻辑

登录后复制

  
  
# 提取code请求参数
  
  
  
  
# 使用code向服务器请求access_token
  
  
  
  
# 使用access_token向服务器请求openid
  
  
  
  
# 使用openid查询该用户是否在美多商城中绑定过用户
  
  
  
  
# 如果openid已绑定美多商城用户，直接生成JWT token，并返回
  
  
  
  
# 如果openid没绑定美多商城用户，创建用户并绑定到openid
  
  

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.
• 11.
• 12.
• 13.
• 14.
• 15.
• 16.
• 17.
• 18.
• 19.
• 20.
• 21.
• 22.
• 23.
• 24.
• 25.
• 26.
• 27.
• 28.
• 29.
• 30.

1. 获取登录扫码页面

1.请求方式

选项	方案
请求方法	GET
请求地址	/qq/login/

2.请求参数：查询参数

参数名	类型	是否必传	说明
next	string	否	用于记录登录成功后进入的网址

3.响应结果：JSON

字段	说明
code	状态码
errmsg	错误信息
login_url	登录扫码页面链接

4.后端逻辑实现

登录后复制

class AuthURLView(View):
    """提供登录页面网址
    
    """
    def get(self, request):
        # next表示从哪个页面进入到的登录页面，将来登录成功后，就自动回到那个页面
        next = request.GET.get('next')

        # 获取登录页面网址
        oauth = OAuth(client_id=settings._CLIENT_ID, client_secret=settings._CLIENT_SECRET, redirect_uri=settings._REDIRECT_URI, state=next)
        login_url = oauth.get_qq_url()

        return http.JsonResponse({'code': RETCODE.OK, 'errmsg': 'OK', 'login_url':login_url})

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.
• 11.
• 12.
• 13.

5.登录参数

登录后复制

_CLIENT_ID = '101518219'
_CLIENT_SECRET = '418d84ebdc7241efb79536886ae95224'
_REDIRECT_URI = '

• 1.
• 2.
• 3.

2. 接收Authorization Code

提示：

• 用户在登录成功后，会将用户重定向到我们配置的回调网址。

• 在重定向到回调网址时，会传给我们一个Authorization Code。

• 我们需要拿到Authorization Code并完成OAuth2.0认证获取openid。

• 在本项目中，我们申请登录开发资质时配置的回调网址为：

  • `

• 互联重定向的完整网址为：

  • `

登录后复制

class AuthUserView(View):
    """用户扫码登录的回调处理"""

    def get(self, request):
        """Oauth2.0认证"""
        # 接收Authorization Code
        code = request.GET.get('code')
        if not code:
            return http.HttpResponseForbidden('缺少code')
        pass

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.

登录后复制

url(r'^oauth_callback/$', views.AuthUserView.as_view()),

• 1.

3. OAuth2.0认证获取openid

1. 使用code向服务器请求access_token
2. 使用access_token向服务器请求openid

登录后复制

class AuthUserView(View):
    """用户扫码登录的回调处理"""

    def get(self, request):
        """Oauth2.0认证"""
        # 提取code请求参数
        code = request.GET.get('code')
        if not code:
            return http.HttpResponseForbidden('缺少code')

        # 创建工具对象
        oauth = OAuth(client_id=settings._CLIENT_ID, client_secret=settings._CLIENT_SECRET, redirect_uri=settings._REDIRECT_URI)

        try:
            # 使用code向服务器请求access_token
            access_token = oauth.get_access_token(code)

            # 使用access_token向服务器请求openid
            openid = oauth.get_open_id(access_token)
        except Exception as e:
            logger.error(e)
            return http.HttpResponseServerError('OAuth2.0认证失败')
        pass

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.
• 11.
• 12.
• 13.
• 14.
• 15.
• 16.
• 17.
• 18.
• 19.
• 20.
• 21.
• 22.
• 23.

4. 本机绑定www.meiduo.site域名

1.ubuntu系统或者Mac系统

登录后复制

编辑 /etc/hosts

• 1.

2.Windows系统

登录后复制

编辑 C:\Windows\System32\drivers\etc\hosts

• 1.

openid是否绑定用户的处理

1. 判断openid是否绑定过用户

使用openid查询该用户是否在美多商城中绑定过用户。

登录后复制

try:
    oauth_user = OAuthUser.objects.get(openid=openid)
except OAuthUser.DoesNotExist:
    # 如果openid没绑定美多商城用户
    pass
else:
    # 如果openid已绑定美多商城用户
    pass

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.

2. openid已绑定用户的处理

如果openid已绑定美多商城用户，直接生成状态保持信息，登录成功，并重定向到首页。

登录后复制

try:
    oauth_user = OAuthUser.objects.get(openid=openid)
except OAuthUser.DoesNotExist:
    # 如果openid没绑定美多商城用户
    pass
else:
    # 如果openid已绑定美多商城用户
    # 实现状态保持
    qq_user = oauth_user.user
    login(request, qq_user)

    # 响应结果
    next = request.GET.get('state')
    response = redirect(next)

    # 登录时用户名写入到cookie，有效期15天
    response.set_cookie('username', qq_user.username, max_age=3600 * 24 * 15)

    return response

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.
• 11.
• 12.
• 13.
• 14.
• 15.
• 16.
• 17.
• 18.
• 19.

3. openid未绑定用户的处理

• 为了能够在后续的绑定用户操作中前端可以使用openid，在这里将openid签名后响应给前端。
• openid属于用户的隐私信息，所以需要将openid签名处理，避免暴露。

登录后复制

try:
    oauth_user = OAuthUser.objects.get(openid=openid)
except OAuthUser.DoesNotExist:
    # 如果openid没绑定美多商城用户
    access_token = generate_eccess_token(openid)
    context = {'access_token': access_token}
    return render(request, 'oauth_callback.html', context)
else:
    # 如果openid已绑定美多商城用户
    # 实现状态保持
    qq_user = oauth_user.user
    login(request, qq_user)

    # 重定向到主页
    response = redirect(reverse('contents:index'))

    # 登录时用户名写入到cookie，有效期15天
    response.set_cookie('username', qq_user.username, max_age=3600 * 24 * 15)

    return response

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.
• 11.
• 12.
• 13.
• 14.
• 15.
• 16.
• 17.
• 18.
• 19.
• 20.

oauth_callback.html中渲染access_token

登录后复制

<input v-model="access_token" type="hidden" name="access_token" value="{{ access_token }}">

• 1.

4. 补充itsdangerous的使用

• itsdangerous模块的参考资料链接 [

• 安装：pip install itsdangerous

• TimedJSONWebSignatureSerializer的使用

  • 使用TimedJSONWebSignatureSerializer可以生成带有有效期的token

登录后复制

from itsdangerous import TimedJSONWebSignatureSerializer as Serializer
from django.conf import settings

  
  
# serializer = Serializer(秘钥, 有效期秒)
  
  
serializer = Serializer(settings.SECRET_KEY, 300)
  
  
# serializer.dumps(数据), 返回bytes类型
  
  
token = serializer.dumps({'mobile': '18512345678'})
token = token.decode()

  
  
# 检验token
  
  
  
  
# 验证失败，会抛出itsdangerous.BadData异常
  
  
serializer = Serializer(settings.SECRET_KEY, 300)
try:
    data = serializer.loads(token)
except BadData:
    return None

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.
• 11.
• 12.
• 13.
• 14.
• 15.
• 16.
• 17.
• 18.
• 19.
• 20.
• 21.
• 22.
• 23.
• 24.
• 25.
• 26.
• 27.
• 28.
• 29.
• 30.
• 31.
• 32.

补充：openid签名处理

• oauth.utils.py

登录后复制

def generate_eccess_token(openid):
    """
    签名openid
    :param openid: 用户的openid
    :return: access_token
    """
    serializer = Serializer(settings.SECRET_KEY, expires_in=constants.ACCESS_TOKEN_EXPIRES)
    data = {'openid': openid}
    token = serializer.dumps(data)
    return token.decode()

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.

openid绑定用户实现

类似于用户注册的业务逻辑

• 当用户输入的手机号对应的用户已存在

  • 直接将该已存在用户跟openid绑定

• 当用户输入的手机号对应的用户不存在

  • 新建一个用户，并跟openid绑定

登录后复制

class AuthUserView(View):
    """用户扫码登录的回调处理"""

    def get(self, request):
        """Oauth2.0认证"""
        ......

    def post(self, request):
        """美多商城用户绑定到openid"""
        # 接收参数
        mobile = request.POST.get('mobile')
        pwd = request.POST.get('password')
        sms_code_client = request.POST.get('sms_code')
        access_token = request.POST.get('access_token')

        # 校验参数
        # 判断参数是否齐全
        if not all([mobile, pwd, sms_code_client]):
            return http.HttpResponseForbidden('缺少必传参数')
        # 判断手机号是否合法
        if not re.match(r'^1[3-9]\d{9}$', mobile):
            return http.HttpResponseForbidden('请输入正确的手机号码')
        # 判断密码是否合格
        if not re.match(r'^[0-9A-Za-z]{8,20}$', pwd):
            return http.HttpResponseForbidden('请输入8-20位的密码')
        # 判断短信验证码是否一致
        redis_conn = get_redis_connection('verify_code')
        sms_code_server = redis_conn.get('sms_%s' % mobile)
        if sms_code_server is None:
            return render(request, 'oauth_callback.html', {'sms_code_errmsg':'无效的短信验证码'})
        if sms_code_client != sms_code_server.decode():
            return render(request, 'oauth_callback.html', {'sms_code_errmsg': '输入短信验证码有误'})
        # 判断openid是否有效：错误提示放在sms_code_errmsg位置
        openid = check_access_token(access_token)
        if not openid:
            return render(request, 'oauth_callback.html', {'openid_errmsg': '无效的openid'})

        # 保存注册数据
        try:
            user = User.objects.get(mobile=mobile)
        except User.DoesNotExist:
            # 用户不存在,新建用户
            user = User.objects.create_user(username=mobile, password=pwd, mobile=mobile)
        else:
            # 如果用户存在，检查用户密码
            if not user.check_password(pwd):
                return render(request, 'oauth_callback.html', {'account_errmsg': '用户名或密码错误'})

        # 将用户绑定openid
        try:
            OAuthUser.objects.create(openid=openid, user=user)
        except DatabaseError:
            return render(request, 'oauth_callback.html', {'qq_login_errmsg': '登录失败'})

        # 实现状态保持
        login(request, user)

        # 响应绑定结果
        next = request.GET.get('state')
        response = redirect(next)

        # 登录时用户名写入到cookie，有效期15天
        response.set_cookie('username', user.username, max_age=3600 * 24 * 15)

        return response

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.
• 11.
• 12.
• 13.
• 14.
• 15.
• 16.
• 17.
• 18.
• 19.
• 20.
• 21.
• 22.
• 23.
• 24.
• 25.
• 26.
• 27.
• 28.
• 29.
• 30.
• 31.
• 32.
• 33.
• 34.
• 35.
• 36.
• 37.
• 38.
• 39.
• 40.
• 41.
• 42.
• 43.
• 44.
• 45.
• 46.
• 47.
• 48.
• 49.
• 50.
• 51.
• 52.
• 53.
• 54.
• 55.
• 56.
• 57.
• 58.
• 59.
• 60.
• 61.
• 62.
• 63.
• 64.
• 65.

用户中心

用户基本信息

用户基本信息逻辑分析

1. 用户基本信息逻辑分析

以下是要实现的后端逻辑

1. 用户模型补充email_active字段
2. 查询并渲染用户基本信息
3. 添加邮箱
4. 发送邮箱验证邮件
5. 验证邮箱

提示：

• 用户添加邮箱时，界面的局部刷新，我们选择使用Vue.js来实现。

原创作者: u_16958431 转载于: https://blog.51cto.com/u_16958431/11854768