DAY 81 vue05

1 版本管理git，svn
2 客户端----》远程仓库（gitee，github，gitlab）
3 基本命令
     -git status
    -git log
    -git reflog
4 忽略文件
     -.idea
    -文件夹名   a文件夹   #忽略掉任何路径下的a文件夹，空文件夹识别不到
    -/文件夹/*.py
    -*
    -?
    -!
    
5 分支
    -master：主分支
    -dev：开发分支
    -bug：改bug--》合道主分支
6 远程仓库
    -git remote
   -git remote add 名字  地址（https、ssh）
    -git push 远程仓库名字 本地分支名    （认证通过）
   -git pull 远程仓库  分支名   （提代码之前一定要先拉）
        -没事就拉一下（保持本地最新的）
    
7 git clone  远程地址  
8 ssh和https
​
9 协同开发
    -冲突（留谁的代码）
    
10 远程分支合并
11 本地分支合并完提到远端
12 远程仓库的版本回滚（慎用-f）
13 其他
    git flow     git工作流
   git fetch和git pull 是fetch+合并
    git rebase  变基
​
14 登录注册相关接口
    -多方式登录
   -验证手机号是否存在
    -发送验证码
   -验证码登录
    -注册

1 vue后端地址配置

1 在vue项目的assets/js/settings.js
    export default {
        BASE_URL:'http://127.0.0.1:8000/'
    }
2 在main.js中导入
    import settings from './assets/js/settings'
   Vue.prototype.$BASE_URL=settings.BASE_URL
​
3 在组件中直接使用
    this.$$BASE_URL

2 media_url的作用

1 只要是数据库中文件，图片，配置这个
    media_url='/media/'
2 序列化字段（文件，图片）
    -当前域+/media/+数据库中存的路径

 

2 vue前端登陆

1 vue前端存储
    -放到cookie中，js来手动放进去（vue-cookies），过期就会消失
   -LocalStorage：本地存储，关闭浏览器也不会消失
    -sessionStorage：会话存储，关闭浏览器，就消失了
​

2.1 登录方法

1 登录方法pwd_login
2 登录成功存入cookie，调用this.close_login()
3 this.close_login()给父组件发送一个close事件
4 父组件的close事件绑定close_login
    close_login() {
        this.is_login = false;
        //当我关闭登录窗口的时候，就从cookie中取一次
        this.token=this.$cookies.get('token')
        this.username=this.$cookies.get('username')
    }
​

 

  pwd_login() {
                if (!(this.username && this.password)) {
                    //用户名或密文为空
                    this.$message({
                        message: '用户名或密码不能为空',
                        type: 'warning'
                    });
​
                } else {
                    //发送axios请求
                    this.$http.post(this.$BASE_URL + 'user/login/', {
                        username: this.username,
                        password: this.password
                    }).then(res => {
                        console.log(res)
                        if (res.data.code == 100) {
                            //登录成功
​
                            //1 存储返回的token，username（可以存的地方有三个）
                            //咱们放到cookie中(放到cookie中)
                            this.$cookies.set('token',res.data.token,'7d')
                            this.$cookies.set('username',res.data.username,'7d')
                            // sessionStorage.setItem()
                            // sessionStorage.getItem()
                            // localStorage.setItem()
                            // localStorage.getItem()
                              //2 销毁框
                            this.close_login()
​
​
                        } else {
                            this.$message({
                                message: res.data.msg,
                                type: 'warning'
                            });
                        }
                    })
                }
​
            },

 

 

3 前端登陆成功显示用户名，注销

 

#html
<div class="right-part">
    <div v-if="!token">
        <span @click="put_login">登录</span>
        <span class="line">|</span>
        <span @click="put_register">注册</span>
    </div>
    <div v-else>
        <span>{{username}}</span>
        <span class="line">|</span>
        <span @click="logout">注销</span>
    </div>
</div>
# js
logout(){
    this.$cookies.remove('token')
    this.$cookies.remove('username')
    this.token=''
    this.username=''
    this.$message('注销成功');
}

 

4 手机号是否存在接口

    @action(methods=['GET'], detail=False)
    def check_phone(self, request, *args, **kwargs):
        phone = request.query_params.get('phone')
        if re.match('^1[3-9][0-9]{9}$', phone):
            user = models.User.objects.filter(mobile=phone).first()
            if user:
                return APIResponse(msg='手机号存在')
            else:
                return APIResponse(code=101, msg='手机号不存在')
​
        else:
            return APIResponse(code=102, msg='手机号不合法')

4.1 前端

1 当手机号的输入框失去焦点时，触发
 @blur="check_mobile"

 

check_mobile() {
                if (!this.mobile) return;  //如果手机号没填，这个方法结束了
                //js的正则   字符串.match('/正则表达式/')
                if (!this.mobile.match(/^1[3-9][0-9]{9}$/)) {
                    this.$message({
                        message: '手机号有误',
                        type: 'warning',
                        duration: 1000,  //message的显示时间
                        onClose: () => {
                            this.mobile = '';  //把手机号清空
                        },

                    });
                    return false;
                }

                //前端输入的手机号是正确手机号，去后端，查看手机号是否存在

                // this.$http.get(this.$BASE_URL+'user/check_phone/?phone='+this.mobile)
                this.$http.get(this.$BASE_URL + 'user/check_phone/', {params: {phone: this.mobile}}).then(res => {
                    console.log(res.data)
                    if (res.data.code == 100) {
                        //正常的,可以发送验证码，如果点击发送验证码按钮，就能点击，否则为false，就不能点击
                        this.is_send = true;
                    } else {
                        this.$message({
                            message: res.data.msg,
                            type: 'warning',
                        })
                    }
                })



            },

 

5 API和SDK的区别

1 API:api接口，第三方厂商，给你提供的http的接口，调用第三方的接口，就可以完成一些事，这就是api接口

2 SDK：软件开发工具包，厂商已经封装了很多底层代码，我们只需要按照文档，使用固定的方法完成固定的事即可（基于api封装出来的）



4 补充
	c语言写的sdk， xx.dll  xx.so  c/c++编译后的动态链接库
    动态链接库：
    	
    from ctypes import *
    #----------以下四种加载DLL方式皆可—————————
    # pDLL = WinDLL("./myTest.dll")
    # pDll = windll.LoadLibrary("./myTest.dll")
    # pDll = cdll.LoadLibrary("./myTest.dll")
    pDll = CDLL("./myTest.dll")

    #调用动态链接库函数（c代码中有这个函数，传入两个参数）
    res = pDll.sum(1,2)
    #打印返回结果
    print(res)

 

6 短信验证码封装

1 注册公众号
2 在腾讯云的短信板块下创建国内短信
3 签名管理（等待审核）
4 模板管理（等待审核）
5 应用管理（创建一个应用）
6 使用：去官方文档扣代码
	-api：比较繁琐
    -sdk：
        -3.0：更强大，不仅仅有发短信的代码，还有很多其他的
        -2.0：只针对与发短信

6.1 短信发送测试代码

# pip install qcloudsms_py


from qcloudsms_py import SmsSingleSender
from qcloudsms_py.httpclient import HTTPError

# 短信应用 SDK AppID
appid =   # SDK AppID 以1400开头
# 短信应用 SDK AppKey
appkey = ""

# 需要发送短信的手机号码
phone_numbers = ["17714558652", ]
# 短信模板ID，需要在短信控制台中申请
template_id =   # NOTE: 这里的模板 ID`7839` 只是示例，真实的模板 ID 需要在短信控制台中申请
# 签名
sms_sign = ""  # NOTE: 签名参数使用的是`签名内容`，而不是`签名ID`。这里的签名"腾讯云"只是示例，真实的签名需要在短信控制台中申请

ssender = SmsSingleSender(appid, appkey)

params = ["5678"]  # 当模板没有参数时，`params = []`
try:
    result = ssender.send_with_param(86, phone_numbers[0],template_id, params, sign=sms_sign, extend="", ext="")

except HTTPError as e:
    print(e)
except Exception as e:
    print(e)
print(result)

6.2 发送短信功能封装

 

1 在libs目录下新建tx_sms包
	__init__.py
    send_sms.py
    settings.py
# __init__.py
from .send_sms import get_code, send

send_sms.py

from qcloudsms_py import SmsSingleSender

from . import settings

from luffyapi.utils.logger import get_logger
import random

logger = get_logger()


# 随机生成四位数字验证码

# 字符串+数字 在python中报错---》python是动态强类型（不同类型之间不能之间运算）
def get_code():
    code = ''
    for i in range(6):
        code += str(random.randint(0, 9))  # 更牛逼的方法自己实现

    return code


def send(phone, code):
    ssender = SmsSingleSender(settings.APPID, settings.APPKEY)
    try:
        result = ssender.send_with_param(86, phone, settings.TEMPLATE_ID, [code, ], sign=settings.SMS_SING, extend="",
                                         ext="")
        if result.get('result') == 0:
            return True
        else:
            # 记录日志
            logger.warning('%s手机号，短信发送失败' % phone)
            return False
    except Exception as e:
        # 记录日志
        logger.warning('%s手机号，短信发送时出异常' % phone)
        return False

 

settings.py

# 短信应用 SDK AppID
APPID = 1400519021  # SDK AppID 以1400开头
# 短信应用 SDK AppKey
APPKEY = "17f5e09eb4a5f33ceab0fd336f480b16"

# 需要发送短信的手机号码

# 短信模板ID，需要在短信控制台中申请
TEMPLATE_ID = 951303  # NOTE: 这里的模板 ID`7839` 只是示例，真实的模板 ID 需要在短信控制台中申请
# 签名
SMS_SING = "末流学习"  # NOTE: 签名参数使用的是`签名内容`，而不是`签名ID`。这里的签名"腾讯云"只是示例，真实的签名需要在短信控制台中申请

 

7 发送短信接口

from rest_framework.decorators import action

from django.core.cache import cache
from django.conf import settings


from .throttlings import SMSThrottle
class SmsView(ViewSet):
    throttle_classes = [SMSThrottle]

    # 发送短信接口，写在这里面
    # 限制同一个手机号短信一分钟，只能发送一次
    @action(methods=['GET'], detail=False)
    def send_sms(self, request, *args, **kwargs):
        phone = request.query_params.get('phone')
        if phone:
            if re.match('^1[3-9][0-9]{9}$', phone):
                code = get_code()
                res = send(phone, code)
                # 短信验证码要，存在哪？django缓存中（默认在内存中，redis）
                cache.set(settings.SMS_PHONE_CACHE % phone, code,60)
                if res:
                    return APIResponse(msg='短信发送成功')
                else:
                    return APIResponse(code=101, msg='短信发送失败')

            else:
                return APIResponse(code=102, msg='手机号不合法')
        else:
            return APIResponse(code=103, msg='没有携带手机号')

路由

router.register('',views.SmsView,'usersms')