美文网首页
Vue Aliplayer直播控件

Vue Aliplayer直播控件

作者: 黄黄黄大帅 | 来源:发表于2020-08-20 19:44 被阅读0次

    Aliplayer是阿里云web视频播放器,是阿里视频云端到云端服务的重要一环,该视频播放器支持点播和直播等基础功能,除此之外同样支持视频的加密播放、清晰度切换、直播时移等业务场景,为用户提供简单、快速、安全、稳定的视频播放服务。
    阿里云Web播放器SDK,同时支持Flash和Html5两种播放技术。目前rtmp直播流仅flash模式支持。

    • flash模式

    视频格式: mp4、flv、m3u8、rtmp
    视频编码: H.264
    音频编码: AAC、MP3
    音频格式:MP3

    • html5模式

    视频格式: mp4、m3u8、flv
    视频编码: H.264
    音频编码: AAC
    音频格式: mp3

    // 直播插件

    > npm install --save vue-aliplayer
    
    <ali-player
          ref="player"
          class="aliplayer"
          width="500px"
          height="400px"
          control-bar-visibility="hover"
          :source="url"
        />
        <button @click="play">播放</button>
        <button @click="pause">暂停</button>
        <button @click="replay">重播</button>
    
    import VueAliplayer from "vue-aliplayer";
    export default {
      name: "Documentation",
      // eslint-disable-next-line vue/no-unused-components
      components: { "ali-player": VueAliplayer },
      data() {
        return {
          url: "https://www.w3school.com.cn/example/html5/mov_bbb.mp4",
        };
      },
      methods: {
        play() {
          const player = this.$refs.player.instance;
          player && player.play();
        },
        pause() {
          const player = this.$refs.player.instance;
          player && player.pause();
        },
        replay() {
          const player = this.$refs.player.instance;
          player && player.replay();
        }
      }
    };
    

    相关文章

      网友评论

          本文标题:Vue Aliplayer直播控件

          本文链接:https://www.haomeiwen.com/subject/lrpejktx.html