博客目录：

......

七、基于Django+mysql的点餐系统设计-第七篇(编写后台会员管理页面及后台系统技术点总结)

八、基于Django+mysql的点餐系统设计-第八篇(H5手机移动端点餐：主页调试-静态页面)

九、第九篇(H5手机移动端点餐："主页调试-动态页面"和店铺切换)

十、基于Django+mysql的点餐系统设计第十篇(H5手机移动端点餐：登录)

本章源码下载地址：

　　H5手机移动端点餐访问页面首先需要获取用户的信息，这里就引入了登录。手机号登录了，才能获取到用户信息，进行后续的订餐等操作。

在mobile/urls.py中添加登录路由：

    # 会员注册/登录    path('register', index.register, name = "mobile_register"), #移动端会员注册/登录表单页

路由添加完后，开始编写views层，在mobile/views/index.py中添加对路由的处理逻辑

def register(request):    '''加载注册/登录页面'''    return render(request, "mobile/register.html")

register函数没有数据处理结果，只是将流程渲染到templates/mobile/register.html页面。register.html代码如下：

{% extends 'mobile/base.html' %}{% load static %}{% block mainbody %}<!--头部-->    <header>        <div class="header">            <h1>登录</h1>            <a href="#" class="return"></a>        </div>    </header><!--内容区-->    <article class="main-container loginContent">        <form action="" method="post">            {% csrf_token %}            <div class="list">                <ul class="line">                    <li><i class="icon-head"></i><input type="text" name="mobile" id="name" placeholder="手机号码"></li>                    <li class="code"><i class="icon-sms"></i><input type="tel" name="code" id="code" placeholder="手机收到的校验码"><button>点击获取</button></li>                </ul>            </div>            <div class="button"><button onclick="location.href='#'">快速登录</button></div>        </form>        <div style="text-align: center;padding: 10px;">测试验证码：1234</div>        <div style="text-align: center;padding: 10px;color: #f00;">{{ info }}</div>    </article>{% endblock %}{% block myjavascript %}    <script type="text/javascript">        $("button:contains('点击获取')").click(function(){            bt = $(this);            if (bt.html() != "点击获取"){                return;            }            var phone = $("#name").val();            bt = $(this);            var t=60;            bt.html(t+"秒")            var mytime = setInterval(function(){                t = t-1;                bt.html(t+"秒")                if(t <= 0){                    clearInterval(mytime)                    bt.html("点击获取");                }            },1000);        });    </script>{% endblock %}

运行工程，访问

把登陆页面写完后，继续执行登录的逻辑。在mobile/urls.py中添加执行登录路由

    path('doregister', index.doRegister, name= "mobile_doregister"), # 执行注册或登录

对于新用户，输入验证码即代表登录，所以需要将新用户的数据新增到数据库，然后再跳到餐品浏览页。另外，发送验证码需要调用第三方接口，这里就在缓存中固定一个验证码，登陆页面输入固定的验证码就可以了。mobile/views/index.py中doRegister编写如下：

def doRegister(request):    '''执行注册/登录'''    # 验证短信码    verifycode = "1234" # request.session['verifycode']    code = request.POST['code']    if verifycode != code:        context = {'info': '验证码错误'}        return render(request, "mobile/register.html", context)    try:        #根据手机号码获取当前会员信息        member = Member.objects.get(mobile=request.POST['mobile'])    except Exception as err:        # 此处可以执行当前会员注册(添加)        ob = Member()        ob.nickname = "顾客" #默认会员名称        ob.avatar = "moren.png" # 默认头像        ob.mobile = request.POST['mobile'] # 手机号码        ob.status = 1        ob.create_at = datetime.now().strftime("%Y-%m-%d %H:%M:%S")        ob.update_at = datetime.now().strftime("%Y-%m-%d %H:%M:%S")        ob.save()        member=ob    # 检查当前会员状态    if member.status == 1:        # 将当前会员信息转换成字典格式并存放到seession中        request.session['mobileuser'] = member.toDict()        # 重定向到首页        return redirect(reverse("mobile_index"))    else:        context = {"info": '此账号信息禁用'}        return render(request, "mobile/register.html", context)

最后，在templates/mobile/register.html中添加执行登录的路由

<!--内容区-->    <article class="main-container loginContent">        <form action="{% url 'mobile_doregister' %}" method="post">            {% csrf_token %}       ......    </article>{% endblock %}

好了，访问，输入手机号、验证码，页面会跳到餐品浏览页

登录流程编写完了，是否发现一个问题，只有访问登陆链接()才通过登录链接进入餐品浏览页，而且随意访问等链接都可以进入到对应的页面，这对于系统的安全是非常不利的。因此，移动端会员点餐也要像后台员工管理那样，增加登录校验。只要缓存中没有用户的信息，用户访问哪个链接都要跳转到登陆页面

　　在myadmin/views/shopmiddleware.py中编写移动会员端是否登录的校验逻辑

 #判断H5移动会员端是否登录        #定义移动端不登录也可以直接访问的url列表        urllist1 = ['/mobile/register','/mobile/doregister']        # 判断当前请求url地址是否是以/mobile开头，并且不在urllist中，才做是否登陆判断        if re.match(r'^/mobile', path) and (path not in urllist1):            # 判断是否登录(在于session中没有mobileuser)            if 'mobileuser' not in request.session:                # 重定向到登录页                return redirect(reverse("mobile_register"))

是否登录逻辑编写完成后，清除缓存后，访问任意链接，如 ，页面跳转到登陆页面。好了，移动端的登录就编写完了。下一篇文章开始编写移动端会员点餐的主要功能：购物车