Using Twitch.tv

In this short tutorial, we first set up Twitch.tv and get the Stream Server URL. We then start streaming, using the Camera Stream URL for input (from previous setup step: connecting your camera) and the full Stream Server URL for output in webcam.io

Optional Step: Embedding the stream into your website.


1.) Set up Twitch

Sign up to Twitch, get the stream key and make some basic settings:

  • click on the profile icon in the upper right, go to Settings then Channel and Videos

twitch.tv - connect ip camera via webcam.io

  • copy the Primary Stream key from there for later

this is optional:

  • enable Disconnect Protection (recommended)
  • Latency Normal should be ok
  • And on the bottom of the page Raids -> Block all raids is recommended, so no random users are sent to your channel on twitch

2.) Set up webcam.io

Create a webcam entry in webcam.io of type Live stream:

Fill in the URL from step 1 into the Input section. Twitch requires an H.264 encoded video stream for input.

Depending on your camera stream, you might need to activate the Transcode options. For H.264 transcoding can stay turned off (default).

Then enter the Stream key URL in Output section, in this example:

rtmp://live-fra02.twitch.tv/app/THE-TWITCH-STREAMKEY-FROM-STEP-1

(We use Frankfurt, Germany ingest server here (ingest servers), because our datacenter is located near there. We fetch from your camera and then send to twitch, so this connection leg is kept close that way.)


3.) Start streaming

By saving the webcam entry (webcam.io), streaming will start within the next 30-60 seconds. The stream status text is shown in the status box in your webcam.io dashboard.

To the stream in Twitch, go to the Creator Dashboard in the profile menu in upper right.

The Stream Health box shows the bitrate coming in and the Twitch Inspector is very helpful to show connect/disconnect times and more.

twitch.tv - connect ip camera via webcam.io

You stream should be broadcasting to the public now! \o/

(Go to profile menu -> channel for the public link to your channel)


4.) Embed into your website

Embedding the twitch player is done by inserting a HTML snippet using your channel name. Here is an example:

<div id="twitch-embed"></div>
<script src="https://embed.twitch.tv/embed/v1.js"></script>
<script type="text/javascript">
  new Twitch.Embed("twitch-embed", {
    width: 854,
    height: 480,
    channel: "CHANNEL-NAME-HERE",
    layout: "video",
    theme: "dark"
  });
</script>

See Embedding Twitch for more details.


Troubleshooting

Please contact us if you need help with a not starting stream or finding the video stream URL of your camera. Also see FAQ.

To use a second stream, you need another Twitch account, using the the other Stream Key and Channelname in another Live stream entry in webcam.io