Vue中接入萤石等直播视频(更新中ing)

一、萤石:

1. 萤石云开发文档: https://open.ys7.com/help/31

2、安装: npm install ezuikit-js --save

3、在文件中引用:import EZUIKit from 'ezuikit-js'

4、具体代码:

获取accessToken:https://open.ys7.com/help/81?h=https://open.ys7.com/api/lapp/token/get
javascript 复制代码
<template>
	<div id="video1" class="video-item"></div>
</template>
<script lang="ts">
import { defineComponent, nextTick, reactive, toRefs, watch } from 'vue'
// 引入萤石云
import EZUIKit from 'ezuikit-js'

export default defineComponent({
  	name: 'VideoDialog',
    setup (props, { emit }) {
    	const YingShiYunVideoPlay = () => {
			const player = new EZUIKit.EZUIKitPlayer({
			  id: 'video1',
			  accessToken: '根据appKey和secret获取的accessToken',
			  url: '拿到的直播链接,以 ezopen:// 开头',
			  template: 'standard',
			  width: 278,
			  height: 156
			})
			player.play()
			// player.stop() // 停止播放
		}
	}
})
</script>

二、乐橙:

https://www.cnblogs.com/why-cn/p/17247548.html

https://www.jianshu.com/p/3d36d5261750

相关推荐
宁风NF1 天前
JavaScript:网络请求与前端通信
开发语言·前端·javascript·网络·学习·ecmascript
明月_清风1 天前
从概念到代码:用 Ontology 构建你的第一个知识图谱
前端·后端
程序员黑豆1 天前
鸿蒙应用开发:AppStorage 全局状态存储用法教程
前端·harmonyos
猫猫不是喵喵.1 天前
Vue3 中 computed 计算属性与 watch、watchEffect 监听
前端·javascript·vue.js
En^_^Joy1 天前
Vue项目创建与入口配置全攻略
前端·vue.js·arcgis
爱码小白1 天前
importlib模块
开发语言·前端·python
猫猫不是喵喵.1 天前
Vue2 的 Vuex 状态管理与 Vue3 的 Pinia 状态管理
前端·javascript·vue.js
greenbbLV1 天前
中小公司积分商城选型:SaaS与私有化方案对比解析
大数据·前端·小程序
看昭奚恤哭1 天前
Flutter 布局核心思想
开发语言·javascript·flutter
朝阳5811 天前
Cesium `Camera.flyTo`:“飞过去“
javascript