前言
予以自乐,好求知,不求甚解
开始
之前是对window.videojs进行劫持初始化函数,我们发现这次无法重新赋值
使用描述符读取函数发现可写为了flase
这是我们有两种方式
1.对其object.definproperty进行劫持,设置writable为true
然后继续进行劫持
2.对videojs进行核心劫持
第一种方案为
+if(unsafeWindow.location.href.indexOf('/modules/video')!==-1){
+ let fuck=Object.defineProperty
+ Object.defineProperty=function(...args){
+ if(args.length>=2){
+ if(args[1]==='videojs'&&args[2]!==undefined){
+ args[2].writable=true
+ }
+ }
+ return fuck.call(this,...args)
+ }
直接对其进行过滤即可
第二种访问
我们需要阅读videojs源码
https://unpkg.com/video.js@7.17.0/dist/video.js
查看代码
(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
typeof define === 'function' && define.amd ? define(factory) :
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.videojs = factory());
}(this, (function () { 'use strict';
umd格式,直接拖底部
return videojs;
发现传出一个函数,我们查找videojs
是一个
function videojs(id, options, ready)
大致阅读代码
var player = videojs.getPlayer(id);
if (player) {
if (options) {
log$1.warn("Player \"" + id + "\" is already initialised. Options will not be applied.");
}
if (ready) {
player.ready(ready);
}
return player;
}
首先获取id,判断是否存在,如果存在则不初始化
这里我一开始试图对Getplayer进行劫持
后来发现少参,放弃
var el = typeof id === 'string' ? $('#' + normalizeId(id)) : id;
if (!isEl(el)) {
throw new TypeError('The element or ID supplied is not valid. (videojs)');
} // document.body.contains(el) will only check if el is contained within that one document.
// This causes problems for elements in iframes.
// Instead, use the element's ownerDocument instead of the global document.
// This will make sure that the element is indeed in the dom of that document.
// Additionally, check that the document in question has a default view.
// If the document is no longer attached to the dom, the defaultView of the document will be null.
if (!el.ownerDocument.defaultView || !el.ownerDocument.body.contains(el)) {
log$1.warn('The element supplied is not included in the DOM');
}
options = options || {};
hooks('beforesetup').forEach(function (hookFunction) {
var opts = hookFunction(el, mergeOptions$3(options));
if (!isObject$1(opts) || Array.isArray(opts)) {
log$1.error('please return an object in beforesetup hooks');
return;
}
options = mergeOptions$3(options, opts);
}); // We get the current "Player" component here in case an integration has
// replaced it with a custom player.
兼容化处理+options合并,跳过
var PlayerComponent = Component$1.getComponent('Player');
player = new PlayerComponent(el, options, ready);
hooks('setup').forEach(function (hookFunction) {
return hookFunction(player);
});
return player;
这里发现通过了Component.GetComponent读了Player函数
然后对其构造,最后调用了Hooks回调钩,传入了一个函数,然后循环遍历
等等,嗯?
hooks钩?
往前翻
hooks('beforesetup').forEach(function (hookFunction) {
var opts = hookFunction(el, mergeOptions$3(options));
if (!isObject$1(opts) || Array.isArray(opts)) {
log$1.error('please return an object in beforesetup hooks');
return;
}
options = mergeOptions$3(options, opts);
});
hooks('setup').forEach(function (hookFunction) {
return hookFunction(player);
});
经典的beforeCreated钩和Created钩
查询参数手册
https://docs.videojs.com/tutorial-hooks.html
videojs.hook('beforesetup', function(videoEl, options) {
// videoEl will be the video element with id="some-id" since that
// gets passed to videojs() below. On subsequent calls, it will be
// different.
videoEl.className += ' some-super-class';
// autoplay will be true here, since we passed it as such.
if (options.autoplay) {
options.autoplay = false
}
// Options that are returned here will be merged with old options.
//
// In this example options will now be:
// {autoplay: false, controls: true}
//
// This has the practical effect of always disabling autoplay no matter
// what options are passed to videojs().
return options;
});
videojs.hook('setup', function(player) {
// Initialize the foo plugin after any player is created.
player.foo();
});
beforesetup
beforesetup occurs just before a player is created. This allows:
Modification of the options passed to the Video.js function (e.g., videojs('some-id, options)).
Modification of the DOM video element that will be used for the player that will be created.
beforesetup hook functions should:
Take two arguments:
videoEl: DOM <video> element that Video.js is going to use to create a player.
options: The options object that Video.js was called with and will be passed to the player during creation.
Return an options object that will be merged with the originally provided options.
```js
setup
setup occurs just after a player is created. This allows:
Plugins or other custom functionality to initialize on the player.
Changes to the player object itself.
setup hook functions:
Take one argument:
player: the player that Video.js created
Don't have to return anything
大概意思就不翻译了
有兴趣谷歌翻译一下
直接秒就完了
结语
社会摇中万人迷,唯有道总着人迷
社会摇中没有将与帅,只有实力这一块