VUE+声网屏幕共享浏览器窗口 “停止共享”

最新推荐文章于 2024-04-26 18:26:55 发布

敢问

最新推荐文章于 2024-04-26 18:26:55 发布

阅读量910

点赞数 2

分类专栏： VUE 文章标签： Vue 声网Agora 屏幕共享 track-ended 事件监听

本文链接：https://blog.csdn.net/weixin_41040445/article/details/124955042

版权

VUE 专栏收录该内容

37 篇文章 0 订阅

订阅专栏

vue+声网开启屏幕共享的时候，浏览器自带提示窗口有停止共享和隐藏

点击停止共享。触发事件函数

 this.s_localTracks.screenShareTrack.on("track-ended", function(){
     console.log(.........)      
 });

Agora Web API Reference - 极速直播 - 文档中心 - 声网Agora

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

敢问

关注关注

2
点赞
踩
3

收藏

觉得还不错? 一键收藏
2
评论
VUE+声网屏幕共享浏览器窗口 “停止共享”

vue+声网直播之屏幕共享爱
复制链接

扫一扫

专栏目录

vue webtrc 浏览器录屏

f335830104的博客

03-11

826

直接上代码吧： <template> <div> <button @click="start" :disabled="disabled.start" >开始录制</button> <button @click="stop" :disabled="disabled.stop" >结束录制</button> <button @cli

useDisplayMedia的使用方法以及案例（vue3）

Etc.End的博客

08-04

1467

的一个只读属性，它返回一个 MediaDevices 对象，里面呢可以对设备的相机、麦克风等媒体输入进行连接访问，同时还可以进行屏幕共享。这样使用起来呢就更加的方便了。这里我们就做一个跟useDisplayMedia一样的屏幕共享的demo，但是我们在它的基础上增加视频录制、并且下载到本地的功能。这个就比较好玩，比如说你像录制自己玩游戏的视频，或者说一些比较短的视频、音乐等等的录制，你可以对这个demo做一些深入的改造。是没有办法正常使用相关的API，比如你的ip是192.**.**.**。........

2 条评论您还未登录，请先登录后发表或查看评论

【声网】实现web端与uniapp微信小程序端音视频互动

最新发布

xiaotangyu7dong的博客

04-26

1715

利用声网实现音视频互动。

前端vue实现共享屏幕

Fwxps的博客

02-22

512

简单的共享屏幕demo

获取屏幕共享视频流

hugang的博客

08-17

463

【代码】获取屏幕共享视频流。

vue2+node实现全栈多人视频会议

LLLLLLLLLLLLLLYYYYYY的博客

11-25

3055

场景：实现多人视频会议。功能：登录、注册、多人音视频（创建房间，进入房间）、会议（音频、视频、共享屏幕）。提示：以下是本篇文章正文内容，下面案例可供参考项目整体部署就行这样，但是对项目的二次开发，还是需要对源码进行解析。主要需要在src文件中进行修改。项目采用的是vue2+node+mysql的全栈操作，可以参考vue2的书和资料。

利用声网进行屏幕共享及关闭共享&&网络状态检测

qq_51196135的博客

10-18

1641

利用声网进行屏幕共享及关闭共享&&网络状态检测

解决vue单页面多个组件嵌套监听浏览器窗口变化问题

11-19

总的来说，解决Vue单页面中多个组件嵌套监听浏览器窗口变化的问题，关键在于合理地管理和传递事件，以及充分利用Vue提供的组件通信机制。无论是使用事件总线还是Vuex，都可以有效地避免事件监听冲突，确保每个组件都...

本项目采用vue+qiankun实践微前端落地.zip

01-20

通过这个项目，开发者不仅可以学习Vue.js的基本用法，还能深入理解Qiankun如何实现在一个单一的浏览器窗口内管理和运行多个独立的前端应用，这对于大型企业级应用的开发和维护具有很高的实践价值。同时，掌握微前端...

vuexsharedmutations在标签窗口之间共享Vuexmutations

08-10

`vuex-shared-mutations` 就是为了解决这个问题而出现的，它使得Vuex的mutations可以在不同的标签页或窗口之间共享。 `vuex-shared-mutations` 是一个开源库，它通过WebSocket或IndexedDB等技术实现在多个标签页间...

Vue+Electron+Vue-router+Vuex+Axios+Element-UI全家桶开发模式编写前端展示与交互界面

10-20

Vuex是一个专为Vue.js应用程序开发的状态管理模式，它集中管理全局状态，解决了组件之间共享状态的问题。 Electron是一个用JavaScript、HTML和CSS构建跨平台桌面应用的框架，它结合了Chromium和Node.js，使得开发者...

Vue3谷歌浏览器调试工具Vue.js devtools 6.1.4

05-30

这对于深入学习Vue3的内部机制，以及与其他开发者共享知识和技巧非常有帮助。 "前端"标签强调了这个工具的主要应用场景，即前端Web开发。Vue.js devtools 在浏览器环境中运行，允许开发者在实际的运行时环境中调试...

Vue 融云音视频会议与屏幕共享

qq_43657524的博客

09-29

1194

预览图片文档链接地址

WebRTC桌面共享--画面嵌套啊

chenquangobeijing的专栏

04-28

788

Vue学习—深入剖析监听组件事件(双向数据绑定)

xun__xing的博客

09-09

842

监听组件事件一、监听组件事件1.监听组件2.使用事件抛出一个值3.事件名4.将原生事件绑定到组件5.在组件上使用 v-model6. .sync 修饰符7.v-model VS .sync 一、监听组件事件 1.监听组件 <div id="app"> <div :style="{fontSize: postFontSize+'em'}"> <blog-post v-for='post in posts' :post='post' :key='post.i

Vue自定义指令监听某一可视区屏幕的变化

a15240780264的博客

10-14

530

自定义指令监听某一可视区屏幕的变化

Vue 数据监视

Tine Aine

11-29

241

<!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title> Vue学习第二天 </title> <script type="text/javascript" src="../js/vue.js"></script>  <link rel="stylesheet"

Vue 02- Vue如何实现数据共享

weixin_57519357的博客

09-25

1980

Vue如何实现数据共享。

electron获取媒体流（实现屏幕分享）

死亡的挽歌的博客

07-02

8964

背景最近项目需要接入直播系统，在调研了多家平台后，发现部分公司的针对electron的sdk存在一些问题，如适配的electron版本较低或sdk本身存在问题，所以使用了web的sdk，然而web的sdk在进行屏幕分享时存在一个权限问题，直接上教程：在electron中使用屏幕分享 1.使用electron提供的接口获取桌面窗口信息 import { desktopCapturer } from 'electron' desktopCapturer.getSources({ types: ['wind

vue使用window.open(), vuex数据不共享的问题

05-24

在使用`window.open()`打开新窗口时，由于新窗口是一个新的浏览器上下文，因此它无法直接访问父窗口的数据。在Vue中使用Vuex进行状态管理时，当在父窗口中修改Vuex中的状态后，新窗口无法立即获取到更新后的状态。解决这个问题的方法有两种： 1. 使用localStorage或sessionStorage 可以在父窗口中将Vuex的状态存储在localStorage或sessionStorage中，在新窗口中再获取这些状态。这样虽然可以解决问题，但是需要手动同步数据，不太方便。 2. 使用postMessage通信可以使用postMessage方法向新窗口发送消息，通过监听新窗口的message事件来获取数据。具体实现可以参考以下代码：在父窗口中： ```javascript // 在打开新窗口前，先将Vuex状态存储在一个变量中 const state = store.state; const win = window.open('new-window.html'); // 监听新窗口的message事件 window.addEventListener('message', function (event) { if (event.source === win) { // 接收新窗口发送的消息，更新状态 store.replaceState(event.data); } }); // 向新窗口发送消息，包含Vuex状态 win.postMessage(state, '*'); ``` 在新窗口中： ```javascript // 监听message事件 window.addEventListener('message', function (event) { // 接收父窗口发送的消息，更新状态 store.replaceState(event.data); }); // 向父窗口发送消息，请求获取Vuex状态 window.opener.postMessage('get-state', '*'); ``` 这样就可以在新窗口中获取到更新后的状态了。需要注意的是，为了安全起见，应该在接收到消息时校验消息来源。

VUE+声网 屏幕共享 浏览器窗口 “停止共享”

VUE+声网屏幕共享浏览器窗口 “停止共享”