Python django框架视频加密 Python django框架 web端视频加密的实例详解

时间:2021-01-28 於兔シ人气:0

视频加密流程图:

视频加密流程图

后端获取保利威的视频播放授权token,提供接口api给前端

参考文档:http://dev.polyv.net/2019/videoproduct/v-api/v-api-play/create-playsafe-token/

在utils下创建polyv.py,编写token生成工具函数，path:utils/polyv.py
utils 是多个模块的公共函数库的文件夹里面存放自己开发的组件

from django.conf import settings
import time
import requests
#pip install requests
import hashlib



class PolyvPlayer(object):
  def __init__(self,userId,secretkey,tokenUrl):
    """初始化，提供用户id和秘钥"""
    self.userId = userId
    self.secretKey = secretkey
    self.tokenUrl = tokenUrl


  def tomd5(self, value):
    """取md5值"""
    return hashlib.md5(value.encode()).hexdigest()

  # 获取视频数据的token
  def get_video_token(self, videoId, viewerIp, viewerId=None, viewerName='', extraParams='HTML5'):
    """
    :param videoId: 视频id
    :param viewerId: 看视频用户id
    :param viewerIp: 看视频用户ip
    :param viewerName: 看视频用户昵称
    :param extraParams: 扩展参数
    :param sign: 加密的sign
    :return: 返回点播的视频的token
    """
    ts = int(time.time() * 1000) # 时间戳
    plain = {
      "userId": self.userId,
      'videoId': videoId,
      'ts': ts,
      'viewerId': viewerId,
      'viewerIp': viewerIp,
      'viewerName': viewerName,

    }

    # 按照ASCKII升序 key + value + key + value... + value 拼接
    plain_sorted = {}
    key_temp = sorted(plain)
    for key in key_temp:
      plain_sorted[key] = plain[key]

    plain_string = ''
    for k, v in plain_sorted.items():
      plain_string += str(k) + str(v)

    # 首尾拼接上秘钥
    sign_data = self.secretKey + plain_string + self.secretKey

    # 取sign_data的md5的大写
    sign = self.tomd5(sign_data).upper()

    # 新的带有sign的字典
    plain.update({'sign': sign})
    # python 提供的发送http请求的模块
    result = requests.post(

      url=self.tokenUrl,
      headers={"Content-type": "application/x-www-form-urlencoded"},
      data=plain     # 平台所需要携带的数据
    ).json() # json.loads 把那拿到的数据序列化
    token = {} if isinstance(result, str) else result.get("data", {})  # 如果保利威视频平台返回的的字符串 token={} 否则
    if token == '':
      return result
    return token

在项目开发时的本地配置配置参数:
配置文件settings/dev.py，代码：

# 保利威视频加密服务
POLYV_CONFIG = {
  "userId":"62dc475e3f",
  "secretkey":"h6FiaEBRMU",
  "tokenUrl":"https://hls.videocc.net/service/v1/token",
}

保利威文档地址:https://my.polyv.net/secure/setting/api 在这里插入图片描述
保利威api参考文档:http://dev.polyv.net/2019/videoproduct/v-api/v-api-play/create-playsafe-token/

在这里插入图片描述

urls.py，主路由代码：

path(r'polyv/',include('polyv.urls')),

在项目主应用文件夹下创建app
命令:
cd 主应用文件夹下
python3 …/…/manage.py startapp polyv

urls.py，子路由代码：

from django.urls import path,re_path
from . import views

urlpatterns = [
  path('video/',views.Video.as_view(),)

]

polyv/views.py，视图代码:

from django.shortcuts import render

# Create your views here.
from rest_framework import status
from lyapi.utils.polyv import PolyvPlayer
from rest_framework.views import APIView
from rest_framework.permissions import IsAuthenticated
from django.conf import settings
from rest_framework.response import Response


class VideoView(APIView):
  # vid = '348e998797383060cb19620b1c600203_3'
  # permission_classes = [IsAuthenticated, ]       #from rest_framework.permissions import IsAuthenticated 登录认证
  def get(self,request):
    polyv_obj = PolyvPlayer(settings.POLYV_CONF['userid'],settings.POLYV_CONF['secretKey'],settings.POLYV_CONF['tokenUrl'])   # 调用polyv文件下的polyv_obj类
    # vid = 'cee1047a76927eb43774263cd93bb69f_c'    # 存在保利威平台的视频ID
    # vid = '348e998797383060cb19620b1c600203_3'     # 存在保利威平台的视频ID
    vid = request.query_params.get('vid')				# 需要把保利威平台的视频ID存在数据库里或者直接或者在前段直接在的Params加 vid cee1047a76927eb43774263cd93bb69f_c
    viewerIp = request.META.get('REMOTE_ADDR')     # 获取用户访问的IP地址
    viewerId = request.user.id             # 获取用户的id
    viewerName = request.user.username         # 获取用户的账号名

    token_dict = polyv_obj.get_video_token(vid,viewerIp,viewerId,viewerName)    # 调用polyv文件下的polyv_obj类下的get_video_token方法
    print(token_dict)

    if 'code' in list(token_dict) and token_dict['code'] != 200:            # 返回请求失败的信息
      return Response(token_dict, status=status.HTTP_403_FORBIDDEN)
    '''
    返回结果:
    {
      "code": 403,
      "status": "error",
      "message": "invalid userId or videoId.",
      "data": ""
    }
    
    '''

    return Response(token_dict)             # 返回请求成功的信息

    '''
    返回结果:
      {
        "token": "43883858-92a3-4f25-a6e8-701d10d88cde-f2",
        "userId": "cee1047a76",
        "appId": null,
        "videoId": "cee1047a76927eb43774263cd93bb69f_c",
        "viewerIp": "127.0.0.1",
        "viewerId": "2",
        "viewerName": "root",
        "extraParams": null,
        "ttl": 600000,
        "createdTime": 1605614888570,
        "expiredTime": 1605615488570,
        "iswxa": 0,
        "disposable": false
      }
    '''

到这里后端的api接口就已经写好啦!
前段 vue界面简写：
在src下的components下新建一个Player.vue

# Player.vue

<template>
  <div class="player">
   <div id="player">

   </div>
  </div>
</template>

<script>
export default {
 name:"Player",
 data () {
  return {

  }
 },


 mounted() { //如果需要对标签进行一些加工处理，然后再放数据时，需要用mounted这个钩子函数，如果单纯的是获取数据，添加到数据属性中
        // 那么用created方法

  this.get_video_data();

 },

 methods: {
    get_video_data(){
     let user_name = localStorage.username || sessionStorage.username; //token认证
    let token = localStorage.token || sessionStorage.token;				//token认证
    console.log(this.$route.params.vid)
     let self = this;
    var player = polyvPlayer({
     wrap: '#player',
     width: document.documentElement.clientWidth - 300,
     height: document.documentElement.clientHeight,
     vid: this.$route.params.vid,
     // forceH5: true,

     // code: user_name,
     playsafe: (vid, next) =>{
      console.log(self)
      self.$axios.get(`${self.$settings.Host}/polyv/video/?vid=${self.$route.params.vid}`,{
       headers:{
       'Authorization':'jwt ' + token
       }
      }).then((res)=>{
       // {‘token':'asasfd'}
       next(res.data.token);

      }).catch((error)=>{

      })


     }
    });
   }
 },
 computed: {
 }
}
</script>

<style scoped>
</style>

src下的router的index.js配置url：

import Vue from 'vue'
import Router from 'vue-router'
import Home from '@/components/Home'
import Login from '@/components/Login'
import Register from "@/components/Register";
import Course from "@/components/Course"
import Detail from "@/components/Detail";
import Cart from "@/components/Cart";
import Order from "@/components/Order";
import Player from "@/components/Player";	//Player组件的url 需要复制这里,其他的url忽略
import Myorder from "@/components/Myorder";	 
Vue.use(Router)

export default new Router({
 mode:'history',
 routes: [
  {
   path: '/',
   //name: 'heme',
   component: Home
  },
    {
   path: '/home',
   //name: 'heme',
   component: Home
  },
    {
   path: '/user/login',
   //name: 'heme',
   component: Login
  },
    {
   path: '/register',
   //name: 'heme',
   component: Register
  },
    {
   path: '/courses',
   //name: 'heme',
   component: Course

  },
  {
   path: '/courses/detail/:id',
   //name: 'heme',
   component: Detail
  },
  {
   path: '/cart',
   //name: 'heme',
   component: Cart
  },
  {
   path: '/order',
   //name: 'heme',
   component: Order
  },
  {
   path: '/myorder',
   //name: 'heme',
   component: Myorder
  },
  {//Player组件的url 需要复制这个括号里的,其他的url忽略
   path: '/polyv/player/:vid',
   //name: 'heme',
   component: Player
  },

 ]
})

自己配置的 访问路径http://www.luffycity.cn:8080/polyv/player/cee1047a76927eb43774263cd93bb69f_c```

加载全部内容