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

相关推荐
vtian1 天前
一篇文章吃透 Monorepo:pnpm + Turborepo + Changesets 全流程实战(含 8 个踩坑)
前端
默_笙1 天前
❗ 点击计数按钮,为什么"峨眉队"也跟着重新渲染?React.memo 说:我记住了
前端·javascript
31535669131 天前
DeepSeek Harness 发布后,我没急着跑 Demo,先把 `.agents/` 翻了一遍
前端·后端·github
名字还没想好☜1 天前
Next.js 用 Server Components 直连数据库:去掉 API 层的边界,和三条别踩的安全红线
前端·javascript·数据库·安全·react·next.js
学习zhao极致it1 天前
2020全新React教程全家桶实战redux+antd+React Hooks前端js视频
前端
用户921080262861 天前
Bubble 消息操作区改造:复制、重新生成和反馈
前端
LEE1 天前
AI Agent 都在疯狂加功能,它说:我全砍了
前端·后端
张清悠1 天前
用 TRAE Work 把 PRD + 设计稿注释,整理成 20 分钟可排期前端任务清单
前端
Brown.alexis1 天前
es6知识点5-自备使用
前端·javascript·es6
杨利杰YJlio1 天前
KB5121003更新详解:安全启动证书、AI组件、资源管理器与安装验证
前端·javascript·后端