<template> <view> <cu-custom bgColor="bg-gradual-blueness" :isBack="true" :isRingt="true"> <block slot="backText">返回</block> <block slot="content">视频播放</block> </cu-custom> <video id="coursewareVideo" :src="src" controls autoplay="autoplay" style="width: 100%;"></video> </view> </template> <script> import { videoPath } from '@/common/tool.js'; export default { data() { return { url: '', src:'' } }, onLoad(options) { var _this = this; _this.url = options.url _this.fnInit() }, methods: { fnInit(){ var _this = this; _this.fnInitVideoPlat() }, fnInitVideoPlat(){ var _this = this; uni.showLoading({ title: '加载中' }); const params = _this.getUrlParams(_this.url) if(!params || !params.serial){ uni.showToast({ title: '网络错误请重试', duration: 2000 }); return } const serial = params.serial uni.request({ url: videoPath +'/api/v1/login', data: { username:"admin", password:"234f3424be5a75ad898a1b55f6e34d9e", url_token_only:true }, method: 'GET', header: { 'Content-type': 'application/json' }, success: (res) => { console.log(res); const token = res.data.URLToken uni.request({ url: videoPath +'/api/v1/stream/start', data: { serial, token }, method: 'GET', header: { 'Content-type': 'application/json' }, success: (ress) => { console.log(ress); _this.src = ress.data.HLS uni.hideLoading();//结束加载中动画 } }) } }) }, getUrlParams(url) { const params = {}; const paramStr = url.split('?')[1]; // 获取问号后面的参数部分 if (paramStr) { const paramArr = paramStr.split('&'); // 将参数字符串分割成键值对数组 paramArr.forEach((param) => { const [key, value] = param.split('='); // 将键值对字符串分割成键和值 params[key] = value; // 将键值对添加到params对象中 }); } return params; } }, } </script> <style lang="scss" scoped> .content { background-color: #fff; padding: 0 20upx; } .button { text-align: center; margin-top: 40upx; margin-bottom: 40upx; button { width: 70%; } } </style>