ps-tcplayer
Version:
Tencent Cloud Player component with Vue2/Vue3 compatibility
329 lines (325 loc) • 16.4 kB
JavaScript
export default class ReportingComponent {
constructor(player, params) {
this.player = player;
this.params = params;
this.currentTime = 0;
this.ali_dt = ""; //视频总时长
this.accumulation = 0; //本次累积播放时长
this.timer = ""; //上报定时器
this.interval = ""; //累计定时器
this.fp = 1; //清晰度
this.playingFlag = false;//是否可以上报开关
this.isPlay = false;
}
//视频可播放状态
ready() {
var self = this;
let t = window.navigator.userAgent;
let r = '';
if (-1 < t.indexOf("Chrome")) {
this.addBeforeunloadEvent(function () {
self.getQuality();
if (self.currentTime >= self.ali_dt) {
self.currentTime = self.ali_dt;
}
let nowTime = new Date().getTime();
let _data = {
m: "time",
id: self.params._lid,
uid: self.params.user_id,
uuid: self.Md5("" + self.params.timestr + self.params.user_id + self.params.random).toString(),
ref: location.href,
os: t.indexOf("Windows") ? "Windows" : "other",
br: (r = t, -1 < r.indexOf("Opera") ? "Opera" : -1 < r.indexOf("Firefox") ? "FF" : -1 < r.indexOf("Chrome") ? "Chrome" : -1 < r.indexOf("Safari") ? "Safari" : -1 < r.indexOf("compatible") && -1 < r.indexOf("MSIE") && !isOpera ? "IE" : void 0),
fp: self.fp,
htime: self.currentTime,//当前播放时间
dt: self.ali_dt, //视频总时长
pt: self.accumulation, //本次累积播放时长
t: nowTime,
sgin: self.Md5("" + nowTime + self.currentTime + self.ali_dt + self.accumulation + "HRkJaX81cAbXdFjWe4Qg6HXxtCR7bJRr").toString(),
cdn: "aliyun",
def: "1",
switchDef: "1",
ver: "1",
platform: 5,
isleave: 1
};
fetch(`${self.params.reportLogUrl}&${new URLSearchParams(Object.entries(_data)).toString()}`, {
method: 'get',
headers: {
'Accept': 'application/json, text/javascript, */*; q=0.01',
'X-Requested-With': 'XMLHttpRequest'
},
keepalive: true
})
})
} else if (-1 < t.indexOf("Safari")) {
this.addBeforeunloadEvent(function () {
self.getQuality();
if ((self.accumulation > 0) && self.isPlay) {
let reportLogUrlList = self.params.reportLogUrl.split('?')
let typeStr = reportLogUrlList[reportLogUrlList.length - 1];
let type ='';
if(typeStr && typeStr.indexOf('=') > -1){
type = typeStr.split('=')[1]
}
let nowTime = new Date().getTime();
let _data = {
type: type,
m: "time",
id: self.params._lid,
uid: self.params.user_id,
uuid: self.Md5("" + self.params.timestr + self.params.user_id + self.params.random).toString(),
ref: location.href,
os: t.indexOf("Windows") ? "Windows" : "other",
br: (r = t, -1 < r.indexOf("Opera") ? "Opera" : -1 < r.indexOf("Firefox") ? "FF" : -1 < r.indexOf("Chrome") ? "Chrome" : -1 < r.indexOf("Safari") ? "Safari" : -1 < r.indexOf("compatible") && -1 < r.indexOf("MSIE") && !isOpera ? "IE" : void 0),
fp: self.fp,
htime: self.currentTime,//当前播放时间
dt: self.ali_dt, //视频总时长
pt: self.accumulation, //本次累积播放时长
t: nowTime,
sgin: self.Md5("" + nowTime + self.currentTime + self.ali_dt + self.accumulation + "HRkJaX81cAbXdFjWe4Qg6HXxtCR7bJRr").toString(),
cdn: "aliyun",
def: "1",
switchDef: "1",
ver: "1",
platform: 5,
isleave: 1
};
let _formData = new FormData();
Object.keys(_data).forEach(key => {
let value = _data[key];
if(typeof value !== 'string'){
value = JSON.stringify(value);
}
_formData.append(key, value)
})
navigator.sendBeacon('/center/player/log/time-post', _formData)
}
})
} else {
this.addBeforeunloadEvent(function () {
self.getQuality();
let nowTime = new Date().getTime();
let _data = {
m: "time",
id: self.params._lid,
uid: self.params.user_id,
uuid: self.Md5("" + self.params.timestr + self.params.user_id + self.params.random).toString(),
ref: location.href,
os: t.indexOf("Windows") ? "Windows" : "other",
br: (r = t, -1 < r.indexOf("Opera") ? "Opera" : -1 < r.indexOf("Firefox") ? "FF" : -1 < r.indexOf("Chrome") ? "Chrome" : -1 < r.indexOf("Safari") ? "Safari" : -1 < r.indexOf("compatible") && -1 < r.indexOf("MSIE") && !isOpera ? "IE" : void 0),
fp: self.fp,
htime: self.currentTime,//当前播放时间
dt: self.ali_dt, //视频总时长
pt: self.accumulation, //本次累积播放时长
t: nowTime,
sgin: self.Md5("" + nowTime + self.currentTime + self.ali_dt + self.accumulation + "HRkJaX81cAbXdFjWe4Qg6HXxtCR7bJRr").toString(),
cdn: "aliyun",
def: "1",
switchDef: "1",
ver: "1",
platform: 5,
isleave: 1
};
$.ajax({
type: "get",
url: `${self.params.reportLogUrl}`,
data: _data,
dataType: 'json',
async: false
});
})
}
}
playing() {
if (!this.params.open) {
return false
}
const player = this.player;
this.isPlay = true;
this.ali_dt = player.getDuration()
this.getQuality();
clearInterval(this.interval);
this.interval = setInterval(() => {
if (player.getStatus() == 'playing') {
this.accumulation = this.accumulation + 1;
}
}, 1000);
if (this.playingFlag) return;
this.playingFlag = true;
setTimeout(() => {
this.playingFlag = false;
}, 500);
this.ajaxRequest();
}
ended() {
clearInterval(this.timer)
clearInterval(this.interval)
this.timer = null;
this.interval = null;
this.onTagAliPlayerProgressLock = false
}
//播放事件改变,通过第二各参数的timestamp属性得到播放时间
timeupdate() {
const player = this.player;
this.currentTime = player.getCurrentTime().toFixed(2);
const playerStatus = player.getStatus();
if (playerStatus != 'ready' && playerStatus != 'pause') {
this.onTagAliPlayerProgress(30000);
}
}
//视频暂停
pause() {
clearInterval(this.timer)
clearInterval(this.interval)
this.timer = null;
this.interval = null;
this.onTagAliPlayerProgressLock = false
if (!this.params.open) {
return false
}
this.ajaxRequest()
}
error() {
clearInterval(this.timer)
clearInterval(this.interval)
this.timer = null;
this.interval = null;
this.onTagAliPlayerProgressLock = false
}
getQuality() {
let Quality = '自动';
try {
const targetElement = document.querySelector(
'.tcp-video-quality-switcher .vjs-selected .vjs-menu-item-text'
);
if (targetElement) {
const textContent = targetElement.textContent.trim();
Quality = textContent;
} else {
console.warn('未找到目标元素,请检查选择器或页面状态');
Quality = '自动';
}
} catch (error) {
Quality = '未知';
}
this.fp = Quality;
}
//加密
Md5(e) {
var a = 0, n = 8;
function t(e) {
return s(r(i(e), e.length * n))
}
function r(e, t) {
e[t >> 5] |= 128 << t % 32, e[14 + (t + 64 >>> 9 << 4)] = t;
for (var r = 1732584193, i = -271733879, a = -1732584194, n = 271733878, s = 0; s < e.length; s += 16) {
var o = r, l = i, u = a, d = n;
i = p(i = p(i = p(i = p(i = f(i = f(i = f(i = f(i = h(i = h(i = h(i = h(i = c(i = c(i = c(i = c(i, a = c(a, n = c(n, r = c(r, i, a, n, e[s + 0], 7, -680876936), i, a, e[s + 1], 12, -389564586), r, i, e[s + 2], 17, 606105819), n, r, e[s + 3], 22, -1044525330), a = c(a, n = c(n, r = c(r, i, a, n, e[s + 4], 7, -176418897), i, a, e[s + 5], 12, 1200080426), r, i, e[s + 6], 17, -1473231341), n, r, e[s + 7], 22, -45705983), a = c(a, n = c(n, r = c(r, i, a, n, e[s + 8], 7, 1770035416), i, a, e[s + 9], 12, -1958414417), r, i, e[s + 10], 17, -42063), n, r, e[s + 11], 22, -1990404162), a = c(a, n = c(n, r = c(r, i, a, n, e[s + 12], 7, 1804603682), i, a, e[s + 13], 12, -40341101), r, i, e[s + 14], 17, -1502002290), n, r, e[s + 15], 22, 1236535329), a = h(a, n = h(n, r = h(r, i, a, n, e[s + 1], 5, -165796510), i, a, e[s + 6], 9, -1069501632), r, i, e[s + 11], 14, 643717713), n, r, e[s + 0], 20, -373897302), a = h(a, n = h(n, r = h(r, i, a, n, e[s + 5], 5, -701558691), i, a, e[s + 10], 9, 38016083), r, i, e[s + 15], 14, -660478335), n, r, e[s + 4], 20, -405537848), a = h(a, n = h(n, r = h(r, i, a, n, e[s + 9], 5, 568446438), i, a, e[s + 14], 9, -1019803690), r, i, e[s + 3], 14, -187363961), n, r, e[s + 8], 20, 1163531501), a = h(a, n = h(n, r = h(r, i, a, n, e[s + 13], 5, -1444681467), i, a, e[s + 2], 9, -51403784), r, i, e[s + 7], 14, 1735328473), n, r, e[s + 12], 20, -1926607734), a = f(a, n = f(n, r = f(r, i, a, n, e[s + 5], 4, -378558), i, a, e[s + 8], 11, -2022574463), r, i, e[s + 11], 16, 1839030562), n, r, e[s + 14], 23, -35309556), a = f(a, n = f(n, r = f(r, i, a, n, e[s + 1], 4, -1530992060), i, a, e[s + 4], 11, 1272893353), r, i, e[s + 7], 16, -155497632), n, r, e[s + 10], 23, -1094730640), a = f(a, n = f(n, r = f(r, i, a, n, e[s + 13], 4, 681279174), i, a, e[s + 0], 11, -358537222), r, i, e[s + 3], 16, -722521979), n, r, e[s + 6], 23, 76029189), a = f(a, n = f(n, r = f(r, i, a, n, e[s + 9], 4, -640364487), i, a, e[s + 12], 11, -421815835), r, i, e[s + 15], 16, 530742520), n, r, e[s + 2], 23, -995338651), a = p(a, n = p(n, r = p(r, i, a, n, e[s + 0], 6, -198630844), i, a, e[s + 7], 10, 1126891415), r, i, e[s + 14], 15, -1416354905), n, r, e[s + 5], 21, -57434055), a = p(a, n = p(n, r = p(r, i, a, n, e[s + 12], 6, 1700485571), i, a, e[s + 3], 10, -1894986606), r, i, e[s + 10], 15, -1051523), n, r, e[s + 1], 21, -2054922799), a = p(a, n = p(n, r = p(r, i, a, n, e[s + 8], 6, 1873313359), i, a, e[s + 15], 10, -30611744), r, i, e[s + 6], 15, -1560198380), n, r, e[s + 13], 21, 1309151649), a = p(a, n = p(n, r = p(r, i, a, n, e[s + 4], 6, -145523070), i, a, e[s + 11], 10, -1120210379), r, i, e[s + 2], 15, 718787259), n, r, e[s + 9], 21, -343485551), r = g(r, o), i = g(i, l), a = g(a, u), n = g(n, d)
}
return Array(r, i, a, n)
}
function o(e, t, r, i, a, n) {
return g(function (e, t) {
return e << t | e >>> 32 - t
}(g(g(t, e), g(i, n)), a), r)
}
function c(e, t, r, i, a, n, s) {
return o(t & r | ~t & i, e, t, a, n, s)
}
function h(e, t, r, i, a, n, s) {
return o(t & i | r & ~i, e, t, a, n, s)
}
function f(e, t, r, i, a, n, s) {
return o(t ^ r ^ i, e, t, a, n, s)
}
function p(e, t, r, i, a, n, s) {
return o(r ^ (t | ~i), e, t, a, n, s)
}
function g(e, t) {
var r = (65535 & e) + (65535 & t);
return (e >> 16) + (t >> 16) + (r >> 16) << 16 | 65535 & r
}
function i(e) {
for (var t = Array(), r = (1 << n) - 1, i = 0; i < e.length * n; i += n)t[i >> 5] |= (e.charCodeAt(i / n) & r) << i % 32;
return t
}
function s(e) {
for (var t = a ? "0123456789ABCDEF" : "0123456789abcdef", r = "", i = 0; i < 4 * e.length; i++)r += t.charAt(e[i >> 2] >> i % 4 * 8 + 4 & 15) + t.charAt(e[i >> 2] >> i % 4 * 8 & 15);
return r
}
return t(e)
}
//阿里播放器上报播放进度
onTagAliPlayerProgress(space) {
if (!this.params.open) {
return false
}
if (!space) {
this.ajaxRequest()
return false
}
if (this.onTagAliPlayerProgressLock) {
return false
}
this.onTagAliPlayerProgressLock = true
clearInterval(this.timer)
this.timer = setInterval(() => {
this.ajaxRequest();
}, space);
}
//请求接口
ajaxRequest() {
if (this.currentTime >= this.ali_dt) {
this.currentTime = this.ali_dt;
}
var t = window.navigator.userAgent;
var r = '';
var nowTime = new Date().getTime();
$.ajax({
type: "get",
url: `${this.params.reportLogUrl}`,
data: {
m: "time",
id: this.params._lid,
uid: this.params.user_id,
uuid: this.Md5("" + this.params.timestr + this.params.user_id + this.params.random).toString(),
ref: location.href,
os: t.indexOf("Windows") ? "Windows" : "other",
br: (r = t, -1 < r.indexOf("Opera") ? "Opera" : -1 < r.indexOf("Firefox") ? "FF" : -1 < r.indexOf("Chrome") ? "Chrome" : -1 < r.indexOf("Safari") ? "Safari" : -1 < r.indexOf("compatible") && -1 < r.indexOf("MSIE") && !isOpera ? "IE" : void 0),
fp: this.fp,
htime: this.currentTime,//当前播放时间
dt: this.ali_dt, //视频总时长
pt: this.accumulation, //本次累积播放时长
t: nowTime,
sgin: this.Md5("" + nowTime + this.currentTime + this.ali_dt + this.accumulation + "HRkJaX81cAbXdFjWe4Qg6HXxtCR7bJRr").toString(),
cdn: "aliyun",
def: "1",
switchDef: "1",
ver: "1",
platform: 5,
isleave: 0
},
dataType: 'json',
async: false,
success: function (result) {
if (result && result.status != null && result.status != 0) {
location.reload();
}
}
});
}
// 页面卸载监听
addBeforeunloadEvent(func) {
var oldBeforeLoad = window.onbeforeunload;
if (typeof oldBeforeLoad !== 'function') {
window.onbeforeunload = func
} else {
window.onbeforeunload = function () {
oldBeforeLoad();
func();
}
}
}
}