webRTC与SRS介绍SRS github地址： https://github.com/ossrs/srs webR

webRTC api详解 : developer.mozilla.org/zh-CN/docs/… (mdn介绍文档，我们只需要使用webRTC api里的Navigator属性)

前期准备（首先肯定得要后端或者运维搭建一个或者部署一个SRS的服务器，该文章都为前端准备）

引入srs.sdk.js文件（直接下载保存到项目里自己的js目录）

文件目录如下：

srs.sdk.js文件介绍

这个文件里面会有四个方法（SrsRtcPublisherAsync，SrsRtcPlayerAsync，SrsRtcWhipWhepAsync，SrsRtcFormatSenders）加一个抛出错误的方法（SrsError）

//初始化
let srsPublish = new SrsRtcPublisherAsync();

//推流
srsPublish.publish(url);
// 这里的url参数是指定 WebRTC 信令SRS服务器的 URL，
// 客户端通过这个 URL 与信令服务器建立连接，从而协商媒体流的传输。

//publish里的网络请求代码 （可以自定义修改使用自己项目封装的axios请求）
var session = await new Promise(function (resolve, reject) {
    // @see https://github.com/rtcdn/rtcdn-draft
    // 请求srs服务器的参数  （后端不该的情况下一般不变）
    var data = {
      api: conf.apiUrl, tid: conf.tid, streamurl: conf.streamUrl,
      clientip: null, sdp: offer.sdp
    };
    console.log("Generated offer: ", data);

    //网络请求  可以修改为你封装的请求
    const xhr = new XMLHttpRequest();
    xhr.onload = function() {
    }
    xhr.open('POST', conf.apiUrl, true);
    xhr.setRequestHeader('Content-type', 'application/json');
    xhr.send(JSON.stringify(data));

    //示例 我就不写引入请求js代码
    publishVideo(data).then(res=>{
      if(res.code){
        rejeck(data);
        return
      }
      resolve(data);
    }).catch(reason=>{rejeck(reason)})
});

//关闭推流
srsPublish.close();

//用于处理接收到的媒体流轨道的回调
srsPublish.ontrack = function (event) {
    self.stream.addTrack(event.track);
};

//初始化
let srsPlayer = new SrsRtcPlayerAsync();

//拉流
srsPlayer.play(url);
// 这里的url参数是指定 WebRTC 信令SRS服务器的 URL，
// 客户端通过这个 URL 与信令服务器建立连接，从而协商媒体流的传输。

//接收拉流的音频流返回值，并赋值到dom里(video标签)
let play = srsPlayer.play(url);
dom.srcObject = play.stream;

//play里的网络请求代码和publish里相同

//关闭推流
srsPlayer.close();

SrsRtcWhipWhepAsync，SrsRtcFormatSenders类

“ SrsRtcWhipWhepAsync ”类是 SRS (Simple Realtime Server) 中的一个用于 WebRTC 实现的高级 API。这个类的命名源于 WHIP 和 WHEP 两个协议，它们是 WebRTC 中用来简化媒体流发布和接收的协议。

WHIP (WebRTC HTTP Ingest Protocol) : 是一种用于简化 WebRTC 媒体发布的协议，通常用于推送媒体流到服务器。它主要是为媒体流的发布（Ingest）设计的，提供了通过简单的 HTTP 请求来处理信令的方式。
WHEP (WebRTC HTTP Egress Protocol) : 是 WHIP 的对称协议，用于从服务器接收 WebRTC 媒体流。它提供了一种简化的方式来处理 WebRTC 媒体流的接收（Egress）。

SrsRtcWhipWhepAsync 类的主要功能是实现基于 WHIP/WHEP 协议的 WebRTC 流媒体推送和接收。

主要用途：

简化信令流程: 通过 WHIP 和 WHEP 协议，信令可以通过简单的 HTTP 请求进行，避免了传统 WebRTC 复杂的 SDP 交换过程。这让开发者更容易实现 WebRTC 的媒体流传输。
媒体流的发布和接收: 该类能够通过 WHIP 协议推送媒体流到服务器，也可以通过 WHEP 协议接收来自服务器的媒体流。
异步操作: SrsRtcWhipWhepAsync 类支持异步操作，这意味着它能够以非阻塞的方式处理 WebRTC 的信令和媒体流传输，提高了性能和响应速度。

实际应用场景：

直播: 开发者可以使用这个类通过 WebRTC 协议推送直播流到服务器（使用 WHIP），并从服务器拉取直播流进行播放（使用 WHEP）。
视频会议: 适用于需要通过 WebRTC 实现的简化视频会议应用程序，使用 HTTP 方式处理信令，降低了实现难度。

总的来说，SrsRtcWhipWhepAsync 类是一个封装了 WHIP 和 WHEP 协议的工具，简化了 WebRTC 流媒体推送和接收的流程，使开发者更容易构建基于 WebRTC 的应用程序。

SrsRtcFormatSenders 是 SRS (Simple Realtime Server) 中与 WebRTC 发送端配置相关的一个类或模块。这个类主要用于处理 WebRTC 发送端的媒体流格式化和发送操作。

主要功能和用途：

格式化媒体发送：

- SrsRtcFormatSenders 负责管理和配置从客户端发送到服务器的媒体流。这包括音频和视频的编码格式（如 H.264、VP8、Opus 等）、比特率、帧率、分辨率等参数。
- 它可能会处理媒体流的格式化，使其符合特定的协议或服务器需求。比如，将媒体流封装为符合 RTP（Real-time Transport Protocol）格式的包。

管理发送的轨道：

- 在 WebRTC 中，一个会话可以包含多个媒体轨道（如音频轨道和视频轨道）。SrsRtcFormatSenders 管理这些轨道的发送，包括选择哪些轨道发送、调整轨道的参数等。
- 该类可能还负责处理与发送端相关的媒体流的生命周期管理，例如开始、暂停和停止发送特定的轨道。

与信令和流媒体服务器的交互：

- SrsRtcFormatSenders 还可能与 SRS 服务器的信令模块进行交互，确保发送的媒体流符合服务器和接收端的要求。
- 它可能需要根据服务器的反馈动态调整媒体发送参数，以保证流媒体传输的质量和稳定性。

应用场景：

直播推流：在实时流媒体推送场景中，SrsRtcFormatSenders 可以用来配置和管理从客户端发送到 SRS 服务器的直播流，确保视频和音频质量符合预期。
视频会议：在视频会议中，可以使用该类管理多个参与者的视频和音频流的发送，并根据网络条件和服务器要求调整参数。

总结：

SrsRtcFormatSenders 是一个专注于 WebRTC 发送端配置和管理的类，主要用于处理媒体流的格式化、轨道管理以及与服务器的交互。通过使用该类，开发者可以更好地控制 WebRTC 发送端的行为，以优化媒体流的传输效果。