VideoJS 通过 RESTful API 动态更改源代码答案

【问题标题】：VideoJS dynamic source change via RESTful APIVideoJS 通过 RESTful API 动态更改源代码
【发布时间】：2015-03-03 01:52:00
【问题描述】：

我遇到了以下问题。我们有一个 AngularJS 应用程序，它应该在路由 example.com/video/:id 上提供视频它调用我们编写的 API 完全正确，我们返回的文件 url 完全正确。现在我们当然想在 VideoJS 中显示这个视频。我们将 JSON 构造为这样的字符串：

var video_sources = '[{ type: "video/mp4", src: "http://example.com/'+data.data.filename+'-360.mp4" }';
        video_sources=video_sources+"]";

我们得到的字符串如下：

[{ type: "video/mp4", src: "http://example.com/clip-360.mp4" }]

现在我们使用 VideoJS 的 .src() 方法来更改源，如下所示：

video_player.src(video_sources);

但现在我们得到一个 VideoJS 错误：

TypeError: Cannot read property 'Tb' of null {stack: (...), message: "Cannot read property 'Tb' of null"}message: "Cannot read property 'Tb' of null"

我无法弄清楚为什么它不起作用。关于播放器的一些信息：当用户访问该站点时，播放器已加载但不可见。如果这很重要，它也没有包含任何视频，但我不这么认为。

【问题讨论】：

video_player 对象是如何创建的——内联还是在指令中？它绑定到哪个 DOM 节点？您如何使视频播放器最初不可见（ng-if，ng-show）？可能需要查看更多代码。
这不是 laravel 问题。
我们在 index.html 中有一个脚本标签，它执行此操作： var video_player = videojs('example_player');我们监听路由变化和显示块而不是显示无。我们使用 Laravel 作为 API，但是很抱歉，这对这个问题并不重要。

【解决方案1】：

修好了！我只是提供了一个对象而不是一个字符串，它起作用了

【讨论】：