The premise

Basic Realization of UniAPP video call through anyRTC audio and video SDK plug-in If the basic video call is not realized, a simple unapp video call can be realized by referring to 10 minutes

Bypass flow push step

1. Grant corresponding rights

To travel toAnyRTC console – Usage statisticsSelect the corresponding item to enable the bypass stream pushing service

2. Adjust the mode

  • Scenario Change the SDK default communication mode to live

     // Set the live mode
 rtcModule.setChannelProfile({
    "profile": 1
 }, (res) = > {
     console.log(res);
 }
Copy the code

  • Role adjustment Role – Anchor: can publish and receive audio and video streams Role – Audience: can only receive audio and video streams

    // set 1 to host and 2 to audience
rtcModule.setClientRole({
 "role": 1
}, (res) = > {
	 console.log(res);
})
Copy the code

3. Set the push view layout and audio Settings

  • Download a sample anyRTC audio and video SDK plug-in from uniApp Plug-in Market

  • Introduce LiveTranscoding, TranscodingUser in utils/classes.js

    import { LiveTranscoding, TranscodingUser } from "./classes.js"
Copy the code

    LiveTranscoding: encapsulated overall layout TranscodingUser: encapsulated anchor layout

  • Set the view layout and audio Settings for the push stream

    When the channel continues to add new anchors and also wants to merge the streams, just call the Settings again

// Single anchor layout
// const anchor = new TranscodingUser(uid, {
// width: 280,
// height: 210,
// x: 0,
// y: 0
// })
// Multiple anchors layout (3 columns)
let anchorList= [];
lists.map((item,index) = > {
   anchorList.push(newTranscodingUser(anchor id uid, {width: 280.height: 210.x: (index % 3) * 280.y: Math.floor(index / 3) * 210,}}))// Set the bypass stream (3 columns)
 rtcModule.setLiveTranscoding({
			"transcoding": new LiveTranscoding(anchorList, {
				width: 840.height: Math.ceil(anchorList.length / 3) * 210,}}),(ret) = > {
		console.log(ret);
});
Copy the code

4. Push the flow

Traverse the push stream if you need to push multiple streams

rtcModule.addPublishStreamUrl({
			url: CDN address of the push stream,transcodingEnabled: true // Transcoding refers to transcoding audio and video streams in bypass mode before pushing them to other RTMP servers
		}, (res) = > {
			console.log("Add bypass push flow", res);
		});
Copy the code

Judging by onRtmpStreamingStateChanged callbacks on flow state Add a callback to setCallBack, through the relevant status code:

        / / status code
		state: {
			0: "Push flow not started or ended".1: "Connecting AR stream server and RTMP server".2: "Push flow is in progress. After successful push flow.".3: "Restoring thrust flow.".4: "Push flow failed"
		},
		/ / error code
		errorCode: {
			0: "Push flow successful".1: "The parameter is invalid. Please check that the input parameter is correct. Make sure you call setLiveTranscoding.".2: "Push stream is encrypted, cannot push stream.".3: "Push stream timeout failed, can push stream again".4: "Error pushing stream server".5: "RTMP server error".6: "Too many push requests".7: "The number of streaming addresses of a single anchor reaches the upper limit 10".8: "Anchor operates streams that do not belong to him, please check App logic".9: "Server could not find this stream".10: "There is an error in the format of the push stream address. Please check whether the format of the push stream address is correct.",}Copy the code

5. Stop pushing

rtcModule.removePublishStreamUrl({
			url: CDN address of push stream,},(res) = > {
			console.log("Cancel bypass push flow", res);
		});
Copy the code