皮皮网

1.?桌面??湲??Դ??Ļ???
2.基于vue实现Web视频聊天和屏幕分享（附源码，PC版+手机版）
3.网络上的共享功主页怎么修改源代码呢？
4.OBS 源码分析- 采集方案之二（显示器采集）

???湲??Դ??Ļ???

       本文将展示如何在纯网页中实现视频聊天和桌面分享功能的Demo，无需额外插件即可在浏览器中运行。源码

       一. 功能及支持平台

       该Demo具备以下功能：

       一对一语音视频聊天

       远程桌面观看

       客户端掉线后自动重连，本桌网络恢复时重连成功

       支持的面共码操作系统包括：Windows、信创国产Linux（银河麒麟、享源限时秒杀页面源码统信UOS）、基本Android、桌面iOS、共享功Mac、源码鸿蒙OS。本桌

       CPU架构：X/X、面共码ARM、享源MIPS、基本Loongarch。桌面

       主流浏览器：Chrome、Edge、Firefox、Safari、浏览器、QQ浏览器等。

       APP套壳内加载Demo页面，同样可正常视频聊天。

       二. 开发环境

       服务端使用Visual Sudio ，C#语言；

       PC端Web：VS Code 1.，Vue 3框架；

       手机端Web：HBuilder 3.8.，蛋糕店网站源码uni-app（导出H5）。

       三. 运行效果

       Demo源码分为三部分：服务端、PC端Web和手机端Web。

       移动端Web运行效果包括：登录界面、已连接提示框、发起视频聊天、手机端不支持桌面分享但可观看PC端桌面。

       PC端Web运行效果包括：登录界面、显示对方摄像头或桌面。

       四. 服务端源码说明

       部署需使用HTTPS协议，服务端需使用WSS协议。本地测试无需准备SSL证书。

       服务端初始化代码需根据部署环境调整配置。

       五. Web端源码说明

       Web端包含移动端和PC端代码，逻辑基本相同。

       消息定义：定义种消息类型用于通信。

       自定义消息处理器：在登录成功后注册回调函数。

       一对一语音视频：用户间发送请求，对方选择同意或拒绝。

       桌面分享：发起和回应过程与语音视频类似。

       断网重连：网络中断时每5秒重试连接。

       六. 本地部署Web端

       移动端：通过HBuilder X运行uniapp项目。

       PC端：安装NodeJS，使用npm命令启动Vue3项目。

       七. 源码与测试

       PC版源码与手机版源码可下载。人人店分销系统源码

       提供测试服务器，方便验证。

       通过本Demo，网页中实现视频聊天和桌面分享功能变得简单可行，满足多种平台与浏览器需求。

基于vue实现Web视频聊天和屏幕分享（附源码，PC版+手机版）

       实现网页文字聊天相对简单，但要实现视频聊天则较为复杂。本文将介绍一个纯网页版的视频聊天和桌面分享的Demo，可直接在浏览器中运行，无需安装插件。

       一. 主要功能及支持平台

       1. 本Demo的主要功能包括：

       （1）一对一语音视频聊天。

       （2）远程桌面观看。

       （3）当客户端掉线时，会自动重连，网络恢复后重连成功。

       2. 支持的平台包括：

       （1）支持的操作系统有：Windows、信创国产Linux（银河麒麟、统信UOS）、Android、iOS、Mac、鸿蒙OS。

       （2）支持的CPU架构有：X/X、ARM、微信砍价活动源码MIPS、Loongarch。

       （3）支持几乎所有主流浏览器：Chrome、Edge、Firefox、Safari、浏览器、QQ浏览器等。

       （4）此外，使用APP套壳，在WebView控件中加载Demo页面，也能正常进行视频聊天。这可以在C/S架构的客户端或手机APP中嵌入WebView控件来引入视频聊天或桌面分享功能。

       二. 开发环境

       1. 服务端：

       服务端开发环境是Visual Studio ，开发语言是C#。

       2. Web端：

       PC版Web开发环境是VS Code 1.，使用vue 3。

       手机版Web开发环境是HBuilder 3.8.，uni-app（导出H5）。

       三. 运行效果

       此Demo的源码分为三个部分：服务端、PC端Web（横版）和手机端Web（竖版）。首先来看移动端Web的运行效果。

       （1）登录界面有三个输入框：服务器IP、用户账号和用户密码，用户账号和用户密码均可随便填写。公众号淘宝客源码

       （2）首页界面有一个已连接的提示框，表示目前与服务端是连接状态，因网络或其他原因断开时，会提示已断开连接。

       （3）发起视频聊天：输入对方的账号，点击请求视频会话按钮即可向对方发起视频聊天请求，对方接受请求后即可聊天。

       （4）手机端不支持分享自己的桌面，但可以观看PC端桌面。

       （5）PC端运行效果：登录后主页界面，左上角是关于自己的一些信息，右边窗口显示连接对方的摄像头或桌面。

       （6）输入对方的账号，点击请求远程桌面，对方同意后即可观看别人的屏幕。

       四. 服务端源码说明

       注意，由于浏览器限制，将Web端部署到公网需要使用HTTPS协议，否则无法访问摄像头。

       服务端也需要使用WSS协议，因此需要准备SSL证书用于部署。若仅在本地运行，则无需准备。

       若不部署，则将服务端初始化代码中的第六行注释掉，并将第七行中的MultimediaServerFactory.CreateMultimediaServer方法中的wssOption用null替换掉。

       若部署在服务器上，则需要将第五行XCertificate2中的两个参数分别修改为证书路径和密码。

       五. Web端源码说明

       本Demo中的Web端包含两套代码，移动端Web采用uni-app开发，PC端Web采用Vue框架开发。关键点如下：

       1. 消息定义：定义了个消息类型，用于Web端之间进行通信，定义放在Vuex或src目录下的omcs目录下。

       2. 自定义消息处理器：在登录成功后，通过调用多媒体管理器上的SetCustomMessageReceivedCallback方法，向multimediaManager注册回调函数，接收消息类型和发起者用户名数据，根据消息类型完成业务操作。

       3. 一对一语音视频：实现逻辑为用户A向用户B发送VideoRequest消息，用户B收到消息后选择同意与否，并将携带用户B意愿数据的VideoResult消息发送给用户A。

       4. 桌面分享：实现逻辑与语音视频类似，请求消息类型为DesktopRequest，响应消息类型为DesktopResult。

       5. 断网重连：网络断开时，每5秒进行与服务器的重新连接，注入ConnectionInterrupted和ConnectionRebuildSucceed回调，在断开和重新连接成功时进行操作。

       六. 如何在本地部署运行Web端

       Web端包含两套代码，移动端Web目录是H5MediaDemo_WebH5，PC端Web目录是H5MediaDemo_WebPC。

       1. 移动端web：通过HBuilder X运行，打开运行→运行到浏览器，选择浏览器即可运行。

       2. PC端web：需要NodeJS环境，安装成功后，在命令行窗口输入node -v和npm -v检查是否安装成功。

       在项目根目录下输入npm run dev运行项目。

       七. 源码下载

       （1）PC版源码

       （2）手机版源码

       此外，已部署测试服务器方便测试。

       （1）PC Web测试网址

       （2）手机 Web测试网址

       网页版视频聊天Demo实现介绍到此结束，感谢！

网络上的主页怎么修改源代码呢？

       修改网页源代码的解决方法是：

       1、首先打开自己要修改的网页，如“百度首页”打开后选择右击鼠标在弹出选项时选择网页另存为或通过浏览器上方右侧的文件、保存网页的形式把网页本地化。

       2、为了更加方便的修改，在保存网页的时候可以做一些设置。比如选择点击桌面，然后点击保存则该网页文件会以html的形式保存到电脑的桌面位置。

       3、之后把浏览器关闭或最小化退出，返回电脑桌面查看已经保存好的网页，这也就实现了本地化。

       4、进行修改，选中网页文件然后鼠标右击选择打开方式，这个时候选择的是记事本，因为本期经验讲的就是用记事本简单快速的修改主页源代码。

       5、以记事本的方式打开网页后会出现一堆的网页编码或文字，看起来是有点乱。不过没关系。这个时候可以通过ctrl+f查找的方式来查找并修改要修改的地方。

       6、在修改成想要的效果后，需要保存，快捷键保存“ctrl+s”鼠标点击“x”符号关闭，在退出时根据提醒通常选择是即保存为已经修改过的。

       7、为了检查修改过源代码的效果，通过回到电脑桌面找到已经修改过的网页。双击并打开，第一个是默认的百度首页，而第二个则是修改过源代码的网页，标题也是修改成功后的标题。

OBS 源码分析- 采集方案之二（显示器采集）

       OBS的视频录制功能支持多种采集方式，其中在plugin-main.c文件中定义了不同采集方式的结构体，并通过extern声明。在Windows系统中，特别是从Windows 8开始，显示器采集方式有所改变，以提高采集效率。Windows 8引入了Microsoft DirectX图形基础设施(DXGI)的API，旨在简化桌面协作和远程桌面访问，这一变化使得应用程序能够更轻松地访问和传输桌面内容。

       Windows 8及更高版本的桌面采集API，称为桌面复制API，通过位图和关联的元数据进行优化，允许应用程序请求访问沿监视器边界的桌面内容。API提供的元数据包括脏区域、屏幕移动、鼠标光标信息等，应用程序可以根据这些信息进行优化，如基于脏区域进行处理、硬件加速移动和鼠标数据、以及压缩等。OBS的桌面复制功能主要在duplicator-monitor-capture.c、monitor-capture.c以及libobs-d3d中实现，使用DXGI技术来获取屏幕数据，相比传统GDI截图技术有显著性能提升。

       在添加采集源时，选择使用DXGI技术可以解决fps采集的挑战，特别是对于Windows 8以上的系统。例如，在duplicator-monitor-capture.c中的duplicator_capture_tick方法会根据系统版本决定采用WCG还是DXGI。在使用DXGI时，关键函数如gs_duplicator_update_frame会被频繁调用，获取桌面资源，并可能遇到如DXGI_ERROR_WAIT_TIMEOUT的返回值处理问题。获取到纹理数据后，需要进行拷贝操作。

       DXGI的开发基于COM技术，如果不熟悉这部分，理解相关代码可能会有难度。但熟悉COM的开发者会注意到，如IDXGIOutputDuplication这样的对象都继承自IUnknown。在使用OBS SDK进行二次开发时，确保包含libobs-winrt生成的DLL文件是至关重要的。