Django 12购物商城项目（1-11 知识点小结）

1、Django框架理解

1.1、浏览器发送请求，到达django的URL。

1.2、URL通过地址分配跳转到相应的View视图中。

1.3、通过views.py数据的传递和展示。

1.3、mtv模型的理解

1.4、GET和POST

2、目录结构解释

3、基础html类、的定义以及继承

4、home

视图函数，主要是从数据库读取信息并传递到前端。

模型，主要定义了四个数据表。都有img、name、trackid，所以让他们继承自Main类

html

4.1、顶部轮播的实现

html



js

5、market

视图

html

5.1、通过GET请求传递前端数据

路由：

注：这里用的 re_path（）是django2的用法，django1直接用url（）即可

视图：

5.2、左边导航条的实现

html

css

/*左边的导航*/
aside {
    width: 2.5rem;
    float: left;
    position: relative;
    background: #fafafa;
    overflow: auto;
    height: 100%;
}

aside ul {
    background: #fafafa;

}

aside ul li {
    list-style: none;
    text-align: center;
    border-bottom: 0.04rem solid #e0e0e0;
    line-height: 1.35rem;
    width: 2.25rem;
    position: relative;
    z-index: +1;

}

aside ul li a {
    display: block;
    font-size: 0.35rem;
    color: grey;
    z-index: +1;
}

.yellowSlide {
    background: yellow;
    width: 0.1rem;
    height: 0.7rem;
    position: absolute;
    left: 0;
    top: 0.3rem;
    display: block;
}

视图

5.3、全部分类的实现

视图



html

js部分

a = "0";

// 点击事件的绑定
$(function () {

    // 展示：全部类型，并收起：综合排序
    the_slideDown("#all_types", "#all_cer", "#sort_rule", "#sort_cer");
    // 收起：全部类型
    the_slideUp("#all_types", "#all_cer",);

    // 展示：综合排序，并收起：全部类型
    the_slideDown("#sort_rule", "#sort_cer", "#all_types", "#all_cer");
    // 收起：综合排序
    the_slideUp("#sort_rule", "#sort_cer",);

})


// the_text:当前点击的文字  the_shade:当前阴影

// 展示
function the_slideDown(the_text, the_shade, other_text, other_shade) {
    $(the_text).click(function () {
        var $the_shade = $(the_shade);

        // 先检查如果当前id已经被点击过了，就视为收起执行
        if (a === the_text) {
            $the_shade.slideUp();
            the_chevron(the_text, "glyphicon-chevron-up", "glyphicon-chevron-down");
            a = "0";

        // 否则展示
        } else {
            // 显示阴影
            $the_shade.slideDown();
            the_chevron(the_text, "glyphicon-chevron-down", "glyphicon-chevron-up");
            var $other_shade = $(other_shade);
            $other_shade.slideUp();
            the_chevron(other_text, "glyphicon-chevron-up", "glyphicon-chevron-down");
            // 记录当前id已经被点击
            a = the_text;
        }

    })
}

// 收起
function the_slideUp(the_text, the_shade) {

    $(the_shade).click(function () {
        // 点击阴影，收回阴影
        var $the_shade = $(the_shade);
        $the_shade.slideUp();
        the_chevron(the_text, "glyphicon-chevron-up", "glyphicon-chevron-down");
        // 清除点击记录
        a = "0"
    })
}


// 改变V形符号，向上向下
function the_chevron(the_text, the_rem, the_add) {
    var $the_text = $(the_text);
    var $span = $the_text.find("span").find("span");
    $span.removeClass(the_rem).addClass(the_add);
}

5.4、综合排序的实现

视图：将所有类型传入前端

视图：在进行查询时就按照对应排序方式查询获取数据

html

（js同5.3）

6、mine

6.1、登录login

视图：

• GET：直接进入login.html
• POST：提交后，判断用户激活情况、密码正确性、存在情况，并把错误信息传入服务器session，再传回前端

6.1.1、session传递错信息

视图：
通过 error_msg = request.session.get('error_msg') 获取错误信息
通过 request.session['error_msg'] = '错误信息' 存入错误信息

当程序需要为某个客户端的请求创建一个session时，
服务器首先检查这个客户端的请求里是否已包含了一个session标识（称为session id），
如果已包含则说明以前已经为此客户端创建过session，
服务器就按照session id把这个session检索出来使用（检索不到，会新建一个）

6.2、用户登录状态检查

视图–>mine函数：

获取请求过来的session，如果存在user_id返回True到html

6.3、退出用户登录状态

**视图：**清空当前id的session内容

mine.html

6.4、注册register

视图：

• GET：直接进入register.html
• POST：用户名、密码、邮箱等信息传入，之后进入login.html

6.5、密码在前端传入前加密（js/md5），防止在传入服务器前被别人截获看见密码

html：在信息提交前return check()，js执行后为True才会提交

js：把密码进行md5加密后，再传递
（先获取id为password_input的标签的值，再将其改为MD5加密后的数值）

登录时不用解密，直接将用户输入的明文进行MD5加密，然后再传入服务器

6.6、密码在入数据库前加密，防止密码明文储存

视图：

• 加密 password = make_password(password)（写在register函数里）
• 解密check_password(password, user.u_password)如果返回True，密码正确（写在login函数里）

6.7、邮箱激活

6.7.1、激活码的生成、储存（redis缓存）、传递

App/views_heiper.py: 通过拼接生成激活连接

视图–>register函数： 通过uuid再哈希加密生成唯一码，通过redis.cache缓存存在服务器，并设置有效期为1天