Converting RTMP to WebRTC With Wowza Streaming Engine

Justin Miller:

Let’s look at how to convert an RTMP stream into WebRTC using Wowza Streaming Engine. And the reason why you’d want to do this is because you have an RTMP stream and maybe it’s coming from a standard encoder, or maybe it’s coming from an IP camera, but you want to be able to show that live stream to a WebRTC group chat.

So to begin, in Wowza Streaming Engine, you’ll need to have a secure way of sending that information. If you already have an account, go to wowza.com and click on My Account at the top. Then go to StreamLock, and it’s here you can Apply for SSL Certificate. Now, once you’ve applied for one, you’ll have a host name, which you’ll be using quite a bit, an IP address, license key. As well, you’ll need to make sure that you’ve downloaded the certificate to your Wowza Streaming Engine installation in the CONF directory.

Now, once all that’s set up, you’ll go into your Wowza Streaming Engine instance, and under Server, you’ll go to Virtual Host Setup and here you’ll need to add a host port. So clicking Edit, you can scroll down and Add Host Port right here, but as you can see I already added the host port for StreamLock. And I’ll just click on Edit here so you can see the settings. But the name is StreamLock, the type is streaming, the IP address is a wild card, the port is 443. You’re going to need to Enable SSL/StreamLock. You’ll need to place a keystore path to get to the StreamLock certificate that you downloaded and put in that CONF directory. You’ll also need to use the keystore password, as well as check Use WebRTC.

Okay. Once all of this is done, you’ll be able to then add the application for this stream. So I’m going to Add Application right here, and I’m going to go and click on Live single server or origin, and I’m going to call this denver, And I’m going to do that in all lowercase.

And now that it’s added, I’m going to go to the left to WebRTC, and I’m going to configure this for both ingest and egress of WebRTC, just so we can make sure everything is working. So I’m going to click on Edit, I’m going to check all of the WebRTC features to enable. And I’m also going to go into the ICE candidate set up, and here I’m going to need to add an IP address. And that IP address, I’m just going to go up here to the top and I’m going to grab it. It’s the IP address for your Wowza Streaming Engine instance. And you want this to be the main priority protocol used, so I’m going to move it to the top. And just to be on the safe side, I’m going to go in and I’m going to just copy this again and change it for TCP, just in case it defaults to TCP.

Okay, now that that’s done, I’ll click Save. And to make this active, I do need to click Restart Now to restart the application. Once that’s done, I can then test this. So we have two testing pages as you can see, both a play page as well as a publish page. And we’re just going to test this right here to make sure everything’s working. Now as you can see, everything has already been set up. It is using my StreamLock URL right here, /webrtc-session.json. And the application name is wrong though, the application name is “denver,” and now the stream name I am going to be, I’m going to leave it as “golden,” it’s fine for it to be that, I happen to be in the golden office.

And I’m just going to Publish this right now, leaving everything as a default. And you can see, on the left side, the live is listed there, letting me know that I’m live. But also if I go back into Wowza Streaming Engine Manager, I can check my incoming streams and I can see that my golden office stream is running and active. And now I can go to the playback window here, I’m just going to bring this down so we can actually see it right next to it. And again, that signaling URL has already been set up with the same information. The only difference here is, again, I need to change the application name to “denver.” All right. So we can see that’s working. I’m just going to turn the audio on so you can hear the audio verify everything is correct. I’ll turn that off now, just so it is not annoying.

Now, the next thing we’re going to need to do is instead of streaming in via WebRTC and playing back via WebRTC, we’re going to instead Stop the stream, close this up, and we’re going to open… Oh, and I don’t have it open. So I am going to open up OBS Studio. Now, I haven’t configured OBS Studio at all here, so I’m going to do some configurations right off the bat. I’m going to add my source. So, my source needs to be both a audio source… So, just to be safe, I’m going to do Audio Input Capture, I’m going to make sure that it’s using my headset right here that I have on right now, and I’m also going to be then pulling in my Video Capture Device, and that is going to be my webcam. There we go.

Okay. And it is using the standard presets, so this is only 720p resolution. Hi. Okay. The next thing I’m going to do is I’m going to go into Settings, and here under Settings, I’m going to go to Stream, and for the service, change it to Custom. Now I can add the server information, which I’m just going to paste in for right now. As you can see, it’s going to my Wowza Streaming Engine IP address, “:1935/”, and then the application, which is “denver.” I’m going to change the stream key. We had “golden,” before and I’m going to make it “arvada.” I’m just going to show it so you can see it. And I’m going to use my authentication, which I’ve already set up in Wowza Streaming Engine.

Now, you’re going to need to do more than this, but I’m just going to show you what happens right now when I start streaming. So just to verify, we are streaming right now. If I go into Wowza Streaming Engine, I can Refresh and see my active stream of “arvada.” And if I go to WebRTC and Open WebRTC Play Page, I’ll switch that stream name to “arvada” and Play, and we’re going to see something that not only is glitchy when it does show you information, but doesn’t have any audio. And that’s because of a few things.

One, it’s because that RTMP needs to be Opus for the audio codec. So we need to convert it or rather transcode it from AAC to Opus. And also, WebRTC doesn’t really like B frames, and so we’ll have to make some changes to the encoder itself. Okay. So first let’s make changes to the encoder, just so you can see how that operates. So I’m going to keep this simple. While I could, and I’m going to stop this stream first, go to Settings, and while I could just go to Output and try to do something like change this to “B frames=zero”, it’s kind of easier for me to just use the output mode Advanced, which does clean up some of these things by default. But as you can see, I’ve also added in here the “B frames=zero” just to be on the safe side.

And one other thing, WebRTC prefers audio that is at a sample rate of 48 kilohertz, or 48,000 hertz. So I’m going to click OK, and as you can see, it wants to restart, and I’m going to let OBS restart this, and now I’m going to Start Streaming once again. And now that I’ve started the stream, I can go back in to Wowza Streaming Engine Manager, and I can Open WebRTC Play Page, and I can go to Play. And as you see right now, the visual is working once again, we are seeing all of our frames, but the audio still is not working.

So the next thing we need to do is go to our Transcoder in Wowza Streaming Engine, and we are going to change the fallback template this time to use Audio Only (Default). Now right now, the audio only transcoder template is set to convert AAC, and what we need to do is add a preset to convert it to Opus. I’m just going to copy the information here that I have right now. What I’m going to do is I’m going to Add preset, I’m going to call this “opus,” “outgoing stream name.” As you can see, I’ve copied it, but I’m changing the end to “opus.”

And then if we scroll to the bottom, we can set the audio setting for the audio codec to be Opus with the audio bitrate to be 48,000. I’m going to Add that. Okay, now that it’s been added, I can go to Opus and I can enable that. And I also may want to disable AAC. You don’t have to, it’s up to you, but you don’t necessarily need to transcode them both. So now that I’m done, I’m going to Return to Transcoder Template, and I am going to Enable Transcoder. So let’s Restart Now.

And once we’ve restarted, OBS needs to disconnect and then reconnect. And then we can go to Incoming Streams, and as you can see, it’s not there quite yet, but if we Refresh, you’ll see it right there, “arvada underscore opus.” Now we can test it by going back to WebRTC, Open WebRTC Play Page, and stream name is “arvada_opus.” Now we can Play it. And if I unmute myself, I can hear the audio playing. Let’s actually go and just see this go and just see this right with Opus running at the same time. And yes, there definitely is a bit of a lag, and it’s definitely hard for me to hear myself when I am talking at the same time.

So that is it for this presentation. I want to thank you all for watching, and definitely if you need a great way to convert RTMP to WebRTC for any number of reasons, Wowza Streaming Engine, is definitely the way to go. Have a great day.