阿里云web端直播(前端部分)

阿里云:Web播放器快速接入_视频点播(VOD)-阿里云帮助中心

javascript 复制代码
import Aliplayer from 'aliyun-aliplayer'

import 'aliyun-aliplayer/build/skins/default/aliplayer-min.css'

    <div id="J_prismPlayer" style="width: 300px; height: 300px;" />

  var player = new Aliplayer({

   id: 'J_prismPlayer',

   source: 'https://playstream.zcwalk.com/AppName/StreamName.flv', // 播放地址,可以是第三方直播地址,或阿里云直播服务中的拉流地址。

   isLive: true, // 是否为直播播放。

   autoplay: true,

   license: {

​    domain: 'zcwalk.com', // 申请 License 时填写的域名

​    key: 'SP6aM3dodVL1ZLX5d5067ef06eb28409d9dbb5b81e8cc6be5' // 申请成功后,在控制台可以看到 License Key

   }

   // LicenseKey: 'SP6aM3dodVL1ZLX5d5067ef06eb28409d9dbb5b81e8cc6be5'

  }, function(player) {

   console.log('The player is created.')

  })

微信小程序直播:

javascript 复制代码
 <live-player id="player" src="https://playstream.zcwalk.com/AppName/StreamName.flv" mode="live" autoplay bindstatechange="statechange" binderror="error" />

 statechange(e) {

  console.log('live-player code:', e.detail.code)

 },

 error(e) {

  console.error('live-player error:', e.detail.errMsg)

 },

 bindPlay() {

  this.ctx.play({

   success: res => {

​    console.log('play success')

   },

   fail: res => {

​    console.log('play fail')

   }

  })

 },

 bindPause() {

  this.ctx.pause({

   success: res => {

​    console.log('pause success')

   },

   fail: res => {

​    console.log('pause fail')

   }

  })

 },

 bindStop() {

  this.ctx.stop({

   success: res => {

​    console.log('stop success')

   },

   fail: res => {

​    console.log('stop fail')

   }

  })

 },

 bindResume() {

  this.ctx.resume({

   success: res => {

​    console.log('resume success')

   },

   fail: res => {

​    console.log('resume fail')

   }

  })

 },

 bindMute() {

  this.ctx.mute({

   success: res => {

​    console.log('mute success')

   },

   fail: res => {

​    console.log('mute fail')

   }

  })

 }
相关推荐
Genie cloud2 小时前
外贸独立站建站完整教程
服务器·数据库·云计算
m0_694845573 小时前
网站账号太多难管理?Enterr 开源自动化工具搭建教程
运维·服务器·前端·开源·自动化·云计算
阿里云云原生3 小时前
RUM 链路打通实战:打破移动端可观测性黑洞
阿里云·云原生·rum
yantaohk4 小时前
【2025亲测】中兴B860AV3.2M完美刷机包ATV版本安卓9-解决1G运存BUG,开ADB已ROOT
android·嵌入式硬件·adb·云计算
许国栋_7 小时前
产品管理系统怎么选?2026主流工具横评、场景适配与避坑
大数据·安全·阿里云·云计算·团队开发
翼龙云_cloud7 小时前
阿里云渠道商:怎么实现阿里云ECI伸缩组镜像自动更新?
服务器·阿里云·云计算
_运维那些事儿8 小时前
GitLabCI-CD入门
运维·ci/cd·容器·云计算·k8s·运维开发
Akamai中国8 小时前
Akamai Cloud客户案例 | Multivrse 信赖 Akamai 为其业务增长提供动力,实现更快资源调配、成本节约与更低延迟
人工智能·云计算·云服务·云存储
不做码农好多年,该何去何从。9 小时前
阿里云上使用docker-compose安装禅道
阿里云·docker·云计算
阿里云云原生9 小时前
阿里云 Serverless 计算 12 月产品动态
阿里云·serverless·云计算