RTSP VS RTMP Protocol
Preparation
IP Camera Stream Solution: video media gateway
How to embed IP camera streams into websites
You may have an IP camera (security camera or ethernet camera) mounted in your home and wondered if you can stream the real-time video onto live platforms or embed the IP live stream into a webpage.
Unfortunately, you cannot find an easy solution natively in your IP camera. Therefore, you have to use some external Apps or hardware to make security cameras globally accessible.
This article tells you how to push stream from your IP camera to any public destination and embed it into a website or even a live chatting webcam.
The IP camera uses RTSP protocol. RTSP is a media-controlling protocol that allows you to monitor your security within your local network.
Public Internet stream uses RTMP protocol. RTMP is a media transmission protocol widely adopted by Youtube, Twitch, Facebook Live, and more live platforms.
To stream the security camera, you need to transfer the original protocol from RTSP to RTMP.
Before you start, you need to:
1. Find out the RTSP address of your IP camera.
2. Prepare a computer that is in the same network as the camera. It would help you to deploy the App, or configure the hardware connected to the local network.
3. Get the Stream URL and key of your target platform (YouTube, Facebook, etc.). You will need the stream URL and stream key to form the RTMP pushing URL.
4. Prepare ORIVISION video media gateway (DH941), or Video Decoder (DH931/ DS931/DS951)
Use Onvif Device Manager Software to find the RTSP address of the network camera. If you have already obtained the RTSP address of the network camera, please ignore this step.
1. Download and installl the Onvif Device Manager Software. The Onvif Software will automatically search for the camera in the Network after opening the software. And the camera will be displayed on the left window.
2. Log-in with the username and password of your camera.
3. Click the “Live video”, then you will get the RTSP address. (Please see the image below)
4. If your camera requires an account and password to access, pls note the format of the RTSP address
For example:
RTSP address is rtsp://192.168.10.64:554/Streaming/Channels/101xxxxxxx
The username and password of camera is admin/admin.
The correct address is rtsp://admin:admin@192.168.10.64:554/Streaming/Channels/101xxxxxxx
Product Features:
High-performance H264/H265 hardware decoding;
Maximum support for 9-way protocol forwarding RTSP /HTTP /UDP/ HTTPS /SRT /RTMP to RTMP /RTMPS /UDP /RTP;
Support the transfer of network port 1 to network port 2;
Multiple streaming targets available;
Support up to 3840 × 2160 output (HDMI interface);
Support for inserting audio (background music) into forwarding streams;
Support local preview output, with a maximum of 9 channels of 720P preview
To get the IP camera data and stream it to public platforms in a video media gateway, you need to do the following steps:
1. Connect video media gateway into your local network, and run it.
2. Open the video media gateway device website console and click decoding settings page.
3. Enter the RTSP address of your network camera in Input settings.
4. Enable RTMP/RTMPS streaming to push webcam streams to platforms such as YouTube and Facebook:
For example:
The RTMP server address is: rtmp://a.rtmp.youtube.com/live2
The stream key is: 7thy-519k-6yux pubs xxxx
Tip: If your camera does not have built-in audio, you need to use video media gateway DH941 to insert the audio
There is no direct way to embed security camera videos into a website. However, embedding YouTube/Facebook/Switch videos into your page is easy.
4.1 Embed YouTube Stream into website:
The steps are as follows:
1. Enter your YouTube live streaming page and click the "Share" button at the bottom of the video.
2. Click on "Embed" in the sharing option and copy the HTML iframe code.
3. Go to your website console and create a test page (or post).
4. If you are using WordPress, please add a 'Custom HTML' block. If you are using a different website builder, select 'Edit as HTML'.
5. Paste the HTML code you just copied from YouTube.
6. Preview and adjust the window width and height values as needed.
7. Publish the page and enjoy your live broadcast.
4.2 Embed Facebook Stream into website:
The steps are as follows:
1. Enter your webcam's Facebook real-time page and click the "Share" button on the right.
2. Click on "Embed" in the sharing option and copy the HTML iframe code.
3. Go to your website console and create a test page (or post).
4. If you are using WordPress, please add a 'Custom HTML' block. If you are using a different website builder, select 'Edit as HTML'.
5. Paste the HTML code you just copied from Facebook.
6. Preview and adjust the window width and height values as needed.
7. Publish the page and enjoy your live broadcast.
4.3 Embed Twitch Stream into website:
The steps are as follows:
1. Go to your webcam Twitch real-time page and click the "Share" button at the bottom.
2. Click on "Embed" in the sharing options and copy the HTML iframe code (please note that Twitch provides two coding methods, including JavaScript, which you can copy).
3. Go to your website console and create a test page (or post).
4. If you are using WordPress, please add a 'Custom HTML' block. If you are using a different website builder, select 'Edit as HTML'.
5. Paste the HTML code you just copied from Twitch.
6. Preview and adjust the window width and height values as needed.
If you copy JavaScript code, be sure to add a height attribute to the video window and provide the correct value.
If copying iframe code, the correct domain name must be entered in the 'parent' attribute. And don't forget to adjust the height value.
7. Publish the page and enjoy your live broadca
