阿里云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')

   }

  })

 }
相关推荐
bugcome_com11 小时前
阿里云 OSS C# SDK 使用实践与参数详解
阿里云·c#
孤岛悬城1 天前
37 日志分析:ELK(Elasticsearch+Logstash+Kibana)
云计算
主机哥哥1 天前
阿里云OpenClaw部署全攻略,五种方案助你快速部署!
服务器·阿里云·负载均衡
珠海西格电力科技1 天前
微电网能量平衡理论的实现条件在不同场景下有哪些差异?
运维·服务器·网络·人工智能·云计算·智慧城市
Sheffield1 天前
command和shell模块到底区别在哪?
linux·云计算·ansible
Hello.Reader1 天前
Flink 对接阿里云 OSS(Object Storage Service)读写、Checkpoint、插件安装与配置模板
大数据·阿里云·flink
DolitD1 天前
云流技术深度剖析:国内云渲染主流技术与开源和海外厂商技术实测对比
功能测试·云原生·开源·云计算·实时云渲染
翼龙云_cloud1 天前
阿里云渠道商:阿里云 ECS 从安全组到云防火墙的实战防护指南
安全·阿里云·云计算
YongCheng_Liang1 天前
从零开始学虚拟化:桌面虚拟化(VDI)入门指南(架构 + 产品 + 部署)
运维·云计算
万物得其道者成2 天前
阿里云 H5 一键登录接入实战:前后端完整实现
阿里云·云计算·状态模式