将videojs-language-switch插件用于video.js的问题

时间:2019-01-22 06:31:22

标签: javascript html video video.js

我正在尝试使用该插件切换video.js的视频语言,可在以下网址找到https://www.npmjs.com/package/videojs-language-switch,并在video.js网站上找到:

但是,我什至无法给出repo蠕虫中给出的最简单的例子, 在浏览器中,我收到此错误:

TypeError: videojs.MenuItem is undefined
Error: plugin "languageSwitch" does not exist

这是我的代码:

HTML:
 <video id="my-video" class="video-js" controls preload="auto" width="640" height="264" poster="MY_VIDEO_POSTER.jpg" data-setup="{}">
<source src="https://cdn-film-http.twig-world.com/TWG00604/2012-02-22/h264-800/b5498f3a034547c3b2a1d4e5c825c6f1.mp4" type='video/mp4' name='English'>

<p class="vjs-no-js">
  To view this video please enable JavaScript, and consider upgrading to a web browser that
  <a href="https://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>
</p>

javascript:
  var player = videojs('my-video');

player.languageSwitch({
languages: [
  {
    name: 'English',
    sources: [
      {
        src: 'https://cdn-film-http.twig-world.com/TWG00604/2012-02-22/h264-800/b5498f3a034547c3b2a1d4e5c825c6f1.mp4',
        type: 'video/mp4',
        res: 'Medium'
      },
      {
        src: 'https://cdn-film-http.twig-world.com/TWG00604/2012-02-22/WebM-800/227a2a4cceb23b1605111bc7797b9bd6.webm',
        type: 'video/webm',
        res: 'Medium'
      }
    ]
  },
  {
    name: 'Portuguese',
    sources: [
      {
        src: 'https://cdn-film-http.twig-world.com/BRPTTWG00604/2013-12-19/h264-800/87558365664a78b2abdc2d915024dc9d.mp4',
        type: 'video/mp4',
        res: 'Medium'
      },
      {
        src: 'https://cdn-film-http.twig-world.com/BRPTTWG00604/2013-12-19/WebM-800/79ba5f114f2cb800abe153deb8fee242.webm',
        type: 'video/webm',
        res: 'Medium'
      }
    ]
  }
]
});

我把它放在这里: https://codepen.io/coucous/pen/ZwELEO

具有以下CDN:

https://vjs.zencdn.net/7.4.1/video-js.css
https://raw.githubusercontent.com/adamoliver/VJS-language-switch/master/videojs.language-switch.css
https://cdnjs.cloudflare.com/ajax/libs/video.js/7.4.2/video.min.js
https://raw.githubusercontent.com/adamoliver/VJS-language-switch/master/videojs.language-switch.js

1 个答案:

答案 0 :(得分:0)

在CodePen上,问题是raw.githubusercontent.com没有正确(故意)设置内容类型标头。您会在控制台中看到这样的错误:

  

拒绝从“ https://raw.githubusercontent.com/adamoliver/VJS-language-switch/master/videojs.language-switch.js”执行脚本,因为其MIME类型(“文本/纯文本”)不可执行,并且启用了严格的MIME类型检查。

尝试使用其他网址,例如