点击下载教程相关资源
Video.js 包含 videojs.log，它是 console API 子集的轻量级封装。可用的方法有 videojs.log、videojs.log.debug、videojs.log.warn 和 videojs.log.error。
这些方法大多不言自明，但要了解完整的详细信息，请参阅 API 文档。
方法 | 别名 | 匹配级别 |
videojs.log() | console.log | all, debug, info |
videojs.log.debug() | console.debug | all, debug |
videojs.log.warn() | console.warn | all, debug, info, warn |
videojs.log.error() | console.error | all, debug, info, warn, error |
videojs.log.createLogger() | n/a | n/a |
videojs.log.level() | n/a | n/a |
videojs.log.history() | n/a | n/a |
videojs.log.history.clear() | n/a | n/a |
videojs.log.history.disable() | n/a | n/a |
videojs.log.history.enable() | n/a | n/a |
videojs.log.history.filter() | n/a | n/a |
与控制台不同，在代码中保留 videojs.log 调用是安全的。当 console 不存在时，它们不会出错。
与 console 类似，可以向 videojs.log 方法传递任意数量的混合类型值：
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Video.js</title>
<!-- 引入 Video.js 样式 -->
<link href="https://vjs.zencdn.net/8.10.0/video-js.css" rel="stylesheet" />
<!-- 如果您想支持 IE8（适用于 v7 之前的 Video.js 版本） -->
<!-- <script src="https://vjs.zencdn.net/ie8/1.1.2/videojs-ie8.min.js"></script> -->
</head>
<body>
<div id="container">
<video id="vid1" class="video-js"
data-setup='{"preload":"auto","controls":true,"width":"640","height":"264px",
"poster":"../resources/oceans.jpg"}'>
<source src="../resources/oceans.mp4" type="video/mp4" />
<source src="../resources/oceans.webm" type="video/webm" />
</video>
</div>
<!-- 引入 Video.js 库 -->
<script src="https://vjs.zencdn.net/8.10.0/video.min.js"></script>
<script>
let player = videojs('vid1');
// 看这里
videojs.log('this is a string', {butThis: 'is an object'});
</script>
</body>
</html>运行示例，如下图：
有时，您想创建一个新模块或插件，并记录带有标签的信息。就像所有这些日志都以 VIDEOJS: 作为前缀一样。您可以通过 createLogger 方法做到这一点。该方法接收一个名称，并返回一个类似 videojs.log 的日志对象。如下示例：
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Video.js</title>
<!-- 引入 Video.js 样式 -->
<link href="https://vjs.zencdn.net/8.10.0/video-js.css" rel="stylesheet" />
<!-- 如果您想支持 IE8（适用于 v7 之前的 Video.js 版本） -->
<!-- <script src="https://vjs.zencdn.net/ie8/1.1.2/videojs-ie8.min.js"></script> -->
</head>
<body>
<div id="container">
<video id="vid1" class="video-js"
data-setup='{"preload":"auto","controls":true,"width":"640","height":"264px",
"poster":"../resources/oceans.jpg"}'>
<source src="../resources/oceans.mp4" type="video/mp4" />
<source src="../resources/oceans.webm" type="video/webm" />
</video>
</div>
<!-- 引入 Video.js 库 -->
<script src="https://vjs.zencdn.net/8.10.0/video.min.js"></script>
<script>
let player = videojs('vid1');
// 看这里
const mylogger = videojs.log.createLogger('mylogger');
mylogger('hello world!');
// > VIDEOJS: mylogger: hello world!
const anotherlogger = mylogger.createLogger('anotherlogger');
anotherlogger('well, hello there');
// > VIDEOJS: mylogger: anotherlogger: well, hello there
</script>
</body>
</html>运行示例，如下图：
与 console 不同，videojs.log 包含日志级别的概念。这些级别可切换日志记录方法的开启或关闭。
级别通过 videojs.log.level 方法公开。该方法既是当前日志级别的获取器，也是设置器。在没有参数的情况下，它会返回当前日志记录级别：
videojs.log.level(); // "info"
通过传递字符串，可将日志记录级别更改为可用的日志记录级别之一：
videojs.log.level('error'); // 只显示错误信息，不显示其他信息
videojs.log('foo'); // 什么也不做
videojs.log.warn('foo'); // 什么也不做
videojs.log.error('foo'); // 将 "foo" 记录为错误info（默认）：只显示 log、log.warn 和 log.error 信息
all：启用所有日志记录方法
error：只显示 log.error 消息
off：禁用所有日志记录方法
warn：只显示 log.warn 和 log.error 消息
debug：显示 log、log.debug、log.warn 和 log.error 信息
尽管日志级别试图与 window.console 对应级别相匹配，但 window.console.debug 并非在所有平台上都可用。因此，它将使用最接近的可比方法，从 window.console.debug 到 window.console.info 再到 window.console.log，如果这些方法都不可用，则最终什么也不使用。
注意：在 Video.js 5 中，videojs.log.history 是一个数组。从 Video.js 6 开始，它是一个返回数组的函数。做出这一更改是为了提供更丰富、更安全的日志历史记录 API。您还可以根据日志记录器的名称过滤历史记录。
默认情况下，无论日志级别如何，videojs.log 模块都会跟踪传给它的所有内容的历史记录：
videojs.log.history(); // 迄今为止所有记录的数组
即使日志记录设置为关闭（off），它也能正常工作。
这可能很有用，但也可能造成内存泄漏。例如，即使在其他地方删除了引用，记录的对象仍会保留在历史记录中！
为了避免这个问题，可以通过方法调用（分别使用 disable 和 enable 方法）禁用或启用历史记录。禁用历史记录非常简单，只需：
videojs.log.history.disable();
最后，可随时通过以下方式清除历史记录（如果已启用）：
videojs.log.history.clear();
如果想查找特定日志记录器创建的所有历史记录，可以通过 history.filter() 来实现。给定一个名称为 foo 的特定日志记录器，将 foo 传递给 history.filter()，就能获得由 foo 创建的所有日志记录器项目。让我举个例子：
const mylogger = videojs.log.createLogger('mylogger');
const anotherlogger = mylogger.createLogger('anotherlogger');
videojs.log('hello');
mylogger('how are you');
anotherlogger('today');
videojs.log.history.filter('VIDEOJS');
// > [['VIDEOJS:', 'hello'], ['VIDEOJS: mylogger:', 'how are you'], ['VIDEOJS: mylogger: anotherlogger:', 'today']]
videojs.log.history.filter('mylogger');
// > [['VIDEOJS: mylogger:', 'how are you'], ['VIDEOJS: mylogger: anotherlogger:', 'today']]
videojs.log.history.filter('anotherlogger');
// > [['VIDEOJS: mylogger: anotherlogger:', 'today']]
川公网安备51010802032098
