You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多
文档控制台
免费开始使用

如何使用JW Player或Video.js播放Google Drive视频?

Hey,我来帮你搞定这个问题——你原来的代码没法正常播放,核心原因是Google Drive的view链接是网页预览地址,不是视频文件的直接播放源。下面分工具给你具体的可行方案:

Video.js 播放Google Drive视频的正确姿势

首先得把Google Drive的视频链接转换成播放器可识别的直接源地址,步骤很简单:

  1. 把目标视频文件在Google Drive里设置为「知道链接的人可查看」(或者公开分享,确保权限足够)
  2. 从你的分享链接里提取文件ID——比如你示例里的0ByaRd0R0Qyatcmw2dVhQS0NDU0U就是文件ID
  3. 把链接格式改成:https://drive.google.com/uc?export=view&id=你的文件ID

修正后的Video.js代码如下:

<video class="video-js" width="640" height="264" controls preload poster="http://video-js.zencoder.com/oceans-clip.png">
  <source src="https://drive.google.com/uc?export=view&id=0ByaRd0R0Qyatcmw2dVhQS0NDU0U" type='video/mp4' />
</video>

如果遇到加载慢或者跨域问题,可以试试把export=view换成export=download,不过后者是强制下载逻辑,部分播放器也能兼容,优先用view模式。

JW Player 播放Google Drive视频的方法

逻辑和Video.js一致,也是用转换后的直接源地址,给你个示例代码:

<div id="jw-player-container"></div>
<script>
jwplayer("jw-player-container").setup({
  file: "https://drive.google.com/uc?export=view&id=0ByaRd0R0Qyatcmw2dVhQS0NDU0U",
  width: 640,
  height: 264,
  poster: "http://video-js.zencoder.com/oceans-clip.png",
  controls: true,
  autostart: false
});
</script>

注意:如果是自托管的JW Player,要确保你的域名在播放器许可范围内,同时文件权限必须设置正确。

WordPress 可用的插件方案

如果不想手动写代码,WordPress有几个现成的插件能帮你搞定:

  • WP Google Drive Embedder:支持直接嵌入Google Drive的视频、文档等资源,自动处理链接转换,不用你手动改地址
  • Embed Google Drive:通过短代码就能在文章/页面里嵌入视频,配置简单,还支持自定义播放器样式
  • Video.js Official Plugin:官方的Video.js插件,安装后你只需要把转换后的Google Drive直接链接作为视频源添加到插件的视频设置里即可
额外提醒
  • 一定要确认Google Drive文件的分享权限,权限不足会导致播放器加载失败
  • 大体积视频可能会有加载延迟,建议测试不同的网络环境
  • 如果遇到MIME类型识别错误,可以在链接末尾加上&mime=video/mp4强制指定类型,比如:https://drive.google.com/uc?export=view&id=你的文件ID&mime=video/mp4

内容的提问来源于stack exchange,提问作者user9712531

火山引擎 最新活动