空包网站分站怎么做,手表网站哪个最好知乎,达州住房和城乡建设厅网站,如何免费创建网站平台美多商城完整教程#xff08;附代码资料#xff09;主要内容讲述#xff1a;欢迎来到美多商城#xff01;#xff0c;项目准备。展示用户注册页面#xff0c;创建用户模块子应用。用户注册业务实现#xff0c;用户注册前端逻辑。图形验证码#xff0c;图形验证码接口设…
美多商城完整教程附代码资料主要内容讲述欢迎来到美多商城项目准备。展示用户注册页面创建用户模块子应用。用户注册业务实现用户注册前端逻辑。图形验证码图形验证码接口设计和定义。短信验证码避免频繁发送短信验证码。账号登录用户名登录。登录登录开发文档。用户基本信息查询并渲染用户基本信息。收货地址省市区三级联动。收货地址展示地址前后端逻辑。商品数据库表设计SPU和SKU。准备商品数据容器化方案Docker。首页广告展示首页商品频道分类。商品列表页列表页面包屑导航。商品搜索Haystack扩展建立索引。商品详情页统计分类商品访问量。购物车管理添加购物车。购物车管理删除购物车。订单结算订单。提交订单使用乐观锁并发下单。对接系统订单支付功能。页面静态化首页广告页面静态化。MySQL读写分离MySQL主从同步。
全套笔记资料代码移步 前往gitee仓库查看
感兴趣的小伙伴可以自取哦欢迎大家点赞转发~ 全套教程部分目录 部分文件图片 登录
登录开发文档 登录即我们所说的第三方登录是指用户可以不在本项目中输入密码而直接通过第三方的验证成功登录本项目。 1. 互联开发者申请步骤 若想实现登录需要成为互联的开发者审核通过才可实现。 相关连接[
2. 互联应用申请步骤 成为互联开发者后还需创建应用即获取本项目对应与互联的应用ID。 相关连接[
3. 网站对接登录步骤 互联提供有开发文档帮助开发者实现登录。 相关连接[
4. 登录流程分析 5. 知识要点
当我们在对接第三方平台的接口时一定要认真阅读第三方平台提供的文档。文档中一定会有接口的使用说明方便我们开发。
定义登录模型类 登录成功后我们需要将用户和美多商场用户关联到一起方便下次登录时使用所以我们选择使用MySQL数据库进行存储。 1. 定义模型类基类 为了给项目中模型类补充数据创建时间和更新时间两个字段我们需要定义模型类基类。 在meiduo_mall.utils/models.py文件中创建模型类基类。 from django.db import modelsclass BaseModel(models.Model):为模型类补充字段create_time models.DateTimeField(auto_now_addTrue, verbose_name创建时间)update_time models.DateTimeField(auto_nowTrue, verbose_name更新时间)class Meta:abstract True # 说明是抽象模型类, 用于继承使用数据库迁移时不会创建BaseModel的表2. 定义登录模型类 创建一个新的应用oauth用来实现第三方认证登录。 # oauthurl(r^oauth/, include(oauth.urls)),在oauth/models.py中定义身份openid与用户模型类User的关联关系 from django.db import modelsfrom meiduo_mall.utils.models import BaseModel# Create your models here.sclass OAuthUser(BaseModel):登录用户数据user models.ForeignKey(users.User, on_deletemodels.CASCADE, verbose_name用户)openid models.C harField(max_length64, verbose_nameopenid, db_indexTrue)class Meta:db_table tb_oauth_qqverbose_name 登录用户数据verbose_name_plural verbose_name3. 迁移登录模型类
$ python manage.py makemigrations
$ python manage.py migrate登录工具LoginTool
1. LoginTool介绍
该工具封装了登录时对接互联接口的请求操作。可用于快速实现登录。
2. LoginTool安装
pip install LoginTool3. LoginTool使用说明 1.导入 from LoginTool.tool import OAuth2.初始化OAuth对象 oauth OAuth(client_idsettings._CLIENT_ID, client_secretsettings._CLIENT_SECRET, redirect_urisettings._REDIRECT_URI, statenext)3.获取登录扫码页面扫码后得到Authorization Code login_url oauth.get_qq_url()4.通过Authorization Code获取Access Token access_token oauth.get_access_token(code)5.通过Access Token获取OpenID openid oauth.get_open_id(access_token)OAuth2.0认证获取openid 待处理业务逻辑 # 提取code请求参数# 使用code向服务器请求access_token# 使用access_token向服务器请求openid# 使用openid查询该用户是否在美多商城中绑定过用户# 如果openid已绑定美多商城用户直接生成JWT token并返回# 如果openid没绑定美多商城用户创建用户并绑定到openid1. 获取登录扫码页面 1.请求方式 选项方案请求方法GET请求地址/qq/login/2.请求参数查询参数
参数名类型是否必传说明nextstring否用于记录登录成功后进入的网址3.响应结果JSON
字段说明code状态码errmsg错误信息login_url登录扫码页面链接4.后端逻辑实现
class AuthURLView(View):提供登录页面网址def get(self, request):# next表示从哪个页面进入到的登录页面将来登录成功后就自动回到那个页面next request.GET.get(next)# 获取登录页面网址oauth OAuth(client_idsettings._CLIENT_ID, client_secretsettings._CLIENT_SECRET, redirect_urisettings._REDIRECT_URI, statenext)login_url oauth.get_qq_url()return http.JsonResponse({code: RETCODE.OK, errmsg: OK, login_url:login_url})5.登录参数 _CLIENT_ID 101518219
_CLIENT_SECRET 418d84ebdc7241efb79536886ae95224
_REDIRECT_URI 2. 接收Authorization Code 提示 用户在登录成功后会将用户重定向到我们配置的回调网址。在重定向到回调网址时会传给我们一个Authorization Code。我们需要拿到Authorization Code并完成OAuth2.0认证获取openid。 在本项目中我们申请登录开发资质时配置的回调网址为 互联重定向的完整网址为
class AuthUserView(View):用户扫码登录的回调处理def get(self, request):Oauth2.0认证# 接收Authorization Codecode request.GET.get(code)if not code:return http.HttpResponseForbidden(缺少code)passurl(r^oauth_callback/$, views.AuthUserView.as_view()),3. OAuth2.0认证获取openid 使用code向服务器请求access_token使用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_idsettings._CLIENT_ID, client_secretsettings._CLIENT_SECRET, redirect_urisettings._REDIRECT_URI)try:# 使用code向服务器请求access_tokenaccess_token oauth.get_access_token(code)# 使用access_token向服务器请求openidopenid oauth.get_open_id(access_token)except Exception as e:logger.error(e)return http.HttpResponseServerError(OAuth2.0认证失败)pass4. 本机绑定www.meiduo.site域名 1.ubuntu系统或者Mac系统 编辑 /etc/hosts2.Windows系统 编辑 C:\Windows\System32\drivers\etc\hostsopenid是否绑定用户的处理 1. 判断openid是否绑定过用户 使用openid查询该用户是否在美多商城中绑定过用户。 try:oauth_user OAuthUser.objects.get(openidopenid)
except OAuthUser.DoesNotExist:# 如果openid没绑定美多商城用户pass
else:# 如果openid已绑定美多商城用户pass2. openid已绑定用户的处理 如果openid已绑定美多商城用户直接生成状态保持信息登录成功并重定向到首页。 try:oauth_user OAuthUser.objects.get(openidopenid)
except OAuthUser.DoesNotExist:# 如果openid没绑定美多商城用户pass
else:# 如果openid已绑定美多商城用户# 实现状态保持qq_user oauth_user.userlogin(request, qq_user)# 响应结果next request.GET.get(state)response redirect(next)# 登录时用户名写入到cookie有效期15天response.set_cookie(username, qq_user.username, max_age3600 * 24 * 15)return response3. openid未绑定用户的处理 为了能够在后续的绑定用户操作中前端可以使用openid在这里将openid签名后响应给前端。openid属于用户的隐私信息所以需要将openid签名处理避免暴露。 try:oauth_user OAuthUser.objects.get(openidopenid)
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.userlogin(request, qq_user)# 重定向到主页response redirect(reverse(contents:index))# 登录时用户名写入到cookie有效期15天response.set_cookie(username, qq_user.username, max_age3600 * 24 * 15)return responseoauth_callback.html中渲染access_token input v-modelaccess_token typehidden nameaccess_token value{{ access_token }}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补充openid签名处理 oauth.utils.py
def generate_eccess_token(openid):签名openid:param openid: 用户的openid:return: access_tokenserializer Serializer(settings.SECRET_KEY, expires_inconstants.ACCESS_TOKEN_EXPIRES)data {openid: openid}token serializer.dumps(data)return token.decode()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(mobilemobile)except User.DoesNotExist:# 用户不存在,新建用户user User.objects.create_user(usernamemobile, passwordpwd, mobilemobile)else:# 如果用户存在检查用户密码if not user.check_password(pwd):return render(request, oauth_callback.html, {account_errmsg: 用户名或密码错误})# 将用户绑定openidtry:OAuthUser.objects.create(openidopenid, useruser)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_age3600 * 24 * 15)return response用户中心
用户基本信息
用户基本信息逻辑分析
1. 用户基本信息逻辑分析 以下是要实现的后端逻辑 用户模型补充email_active字段查询并渲染用户基本信息添加邮箱发送邮箱验证邮件 验证邮箱 提示 用户添加邮箱时界面的局部刷新我们选择使用Vue.js来实现。
未完待续 同学们请等待下一期
全套笔记资料代码移步 前往gitee仓库查看
感兴趣的小伙伴可以自取哦欢迎大家点赞转发~
