Question

我将videojs（http://videojs.com/）插件与youtube.js（https://github.com/eXon/videojs-youtube）结合使用，在自定义播放器中播放YouTube视频。

在头部我从video.js加载css，这是html正文

<div id="am-youtube-container" class="row collapse">
   <video
     id="vid1"
     class="video-js vjs-default-skin"
     controls
     autoplay
     width="640" height="264"
     data-setup='{ "techOrder": ["youtube"], "sources": [{ "type": "video/youtube", "src": "https://www.youtube.com/watch?v=xjS6SftYQaQ"}] }'
   >
   </video>
   <script src="http://vjs.zencdn.net/5.0/video.min.js"/>
   <script src="path to youtubejs/Youtube.js"/>
</div>

我总是收到以下错误：

VIDEOJS: ERROR: The "Youtube" tech is undefined. Skipped browser support check for that tech.
VIDEOJS: ERROR: (CODE:4 MEDIA_ERR_SRC_NOT_SUPPORTED) No compatible source was found for this video.

我无法找到解决方案。当我使用youtube.js中的示例时，它使用完全相同的代码。

Answer 1

通过凉亭获取youtube.js：

bower install videos-youtube

然后你会在文件夹bower_component中同时拥有video.min.js和Youtube.min.js：

将其粘贴为html：

<!DOCTYPE html>
<html>
<head>
  <link type="text/css" rel="stylesheet" href="bower_components/video.js/dist/video-js.min.css" />
</head>
<body>

<div id="am-youtube-container" class="row collapse">
   <video
     id="vid1"
     class="video-js vjs-default-skin"
     controls
     autoplay
     width="640" height="264"
     data-setup='{ "techOrder": ["youtube"], "sources": [{ "type": "video/youtube", "src": "https://www.youtube.com/watch?v=xjS6SftYQaQ"}] }'
   >
   </video>
   <script src="http://vjs.zencdn.net/5.0/video.min.js"/>
   <script src="path to youtubejs/Youtube.js"/>
</div>

  <script src="bower_components/video.js/dist/video.min.js"></script>
  <script src="bower_components/videojs-youtube/dist/Youtube.min.js"></script>
</body>
</html>

所以我尝试了，解决方案正在取代：

   <script src="http://vjs.zencdn.net/5.0/video.min.js"/>

用这个：

  <script src="bower_components/video.js/dist/video.min.js"></script>

在youtube.js中使用videojs

1 个答案: