<?xml version="1.0" encoding="UTF-8"?>
<feed xmlns="http://www.w3.org/2005/Atom" xml:lang="en-gb">
	<link rel="self" type="application/atom+xml" href="https://blueirissoftware.com/forum/app.php/feed/topic/2088" />

	<title>Blue Iris</title>
	<subtitle>Blue Iris User Group</subtitle>
	<link href="https://blueirissoftware.com/forum/index.php" />
	<updated>2021-02-24T00:11:37+00:00</updated>

	<author><name><![CDATA[Blue Iris]]></name></author>
	<id>https://blueirissoftware.com/forum/app.php/feed/topic/2088</id>

		<entry>
		<author><name><![CDATA[varghesesa]]></name></author>
		<updated>2021-02-24T00:11:37+00:00</updated>

		<published>2021-02-24T00:11:37+00:00</published>
		<id>https://blueirissoftware.com/forum/viewtopic.php?p=8142#p8142</id>
		<link href="https://blueirissoftware.com/forum/viewtopic.php?p=8142#p8142"/>
		<title type="html"><![CDATA[Web server &amp; Webcasting]]></title>

		
		<content type="html" xml:base="https://blueirissoftware.com/forum/viewtopic.php?p=8142#p8142"><![CDATA[
<span style="font-size:150%;line-height:116%"><strong class="text-strong">Introduction</strong></span><br>Besides being a Video Management System, Blue Iris is also a Streaming Server.  This allows users to share their camera feeds externally.  The best way to understand how to leverage BI's streaming services is via the following use cases.<br><br><div class="inline-attachment"><dl class="file"><dt class="attach-image"><img src="https://blueirissoftware.com/forum/download/file.php?id=1500" class="postimage" alt="BI webcasting.png" onclick="viewableArea(this);" /></dt></dl></div><br><br><em class="text-italics">Webcasting (video streaming) Pipeline</em><br><br>Standard streaming pipeline: IP Cameras -&gt; Media Server -&gt; Endpoint<br><ul><li>IP Cameras<br>The process starts with a video capture device otherwise known as a IP camera.  The camera is dedicated hardware that usually captures 15-30 frames per second.<br>IP Cameras are high performance computers which is why they are so expensive.  <strong class="text-strong">Compression</strong> algorithms are responsible for shrinking each frame to manageable chunks which can be transported over the internet.  H.264 and H.265 are standard compression algorithms supported by Blue Iris.<br><strong class="text-strong">Packaging</strong> involves bundling all the compressed frames into manageable sizes that can be transported over the network.  Think of packaging as grouping 1-3s of video frames into one chunk of data that is transported across the network.  HLS, MPEG DASH, RTMP and RTSP are all common protocols for video streaming.</li><li>Network: Responsible for moving the data from cameras to Blue Iris.</li><li>Blue Iris.  Media server + Video Management System<br>Blue Iris is also a media server.  Media servers can take streams in one format, for example RTSP from a camera and convert them to another format, for example, RTMP so that users can, for example, share their camera streams elsewhere such as YouTube.  Media servers are responsible for taking video/audio inputs and streaming the content to various endpoints.</li><li>Network</li><li>And the final destination is the endpoint playing the video, for example a browser on a laptop, a mobile device, a TV, a gaming device etc.</li></ul>In terms of the video pipeline as defined in the <a href="viewtopic.php?f=11&amp;t=2424" class="postlink">BI Streaming Overview article</a>:<br>Source -&gt; Decode -&gt; Encode -&gt; Endpoint<ul><li>IP Cameras = Source</li><li>Media server = Decode + Encode</li><li>Endpoint = Endpoint</li></ul><br><span style="font-size:150%;line-height:116%"><strong class="text-strong">Web server</strong></span><br><br>Global settings -&gt; Web server tab<div style="margin-left:3em"><br>Every time a user accesses BI via a remote endpoint (mobile app, web browser), a connection is made between the BI web server and the endpoint.<br><div class="inline-attachment"><dl class="file"><dt class="attach-image"><img src="https://blueirissoftware.com/forum/download/file.php?id=2258" class="postimage" alt="BI web server.png" onclick="viewableArea(this);" /></dt></dl></div><br></div><strong class="text-strong">Web server streams</strong><br><br>Global settings -&gt; Web server tab -&gt; Advanced  <br><div style="margin-left:3em"><br>BI allows for <strong class="text-strong">three types of streams</strong> from the web server.<br><br><div class="inline-attachment"><dl class="file"><dt class="attach-image"><img src="https://blueirissoftware.com/forum/download/file.php?id=2257" class="postimage" alt="webserver streams.PNG" onclick="viewableArea(this);" /></dt></dl></div><br>Recommendations:<br>Streaming 0 profile: Leveraged by the UI3 endpoint.  I would leave these settings as default.<br>Streaming 1 profile: LAN.  Create a profile that works well in your LAN.  Since these endpoints only sit on the LAN, you may want to provide a richer user experience via higher resolution streams.<br>Streaming 2 profile: WAN.  Network bandwidth may be challenging on the WAN so you may want to make stream adjustments, e.g. trade-off resolution (small screen any way) for smooth video.<br>See mobile apps section below for some streaming recommendations.<br><br></div><strong class="text-strong">Web server encoding settings</strong><div style="margin-left:3em"><br>Global settings -&gt; Web server tab -&gt; Advanced -&gt; Configure button<br><br><div class="inline-attachment"><dl class="file"><dt class="attach-image"><img src="https://blueirissoftware.com/forum/download/file.php?id=2259" class="postimage" alt="webserver encoding.PNG" onclick="viewableArea(this);" /></dt></dl></div><br><span style="text-decoration:underline">H.264 Encoding Settings</span><ul><li>H.264 video encoding</li><li><strong class="text-strong">Hardware acceleration:</strong> Usually set to No.  Many GPUs do a poor job of HA encoding which leads to streams that cannot be played by media players.  Best to leave off.</li><li><strong class="text-strong">Quality</strong>: Value from 0 - 100.  Lower the value, lower the quality.  The marginal difference in quality after a certain point is minimal.  For example, 100 does not produce an image that is twice the quality of a 50 setting.  In most cases, quality = 50 is plenty good.</li><li><strong class="text-strong">Rate control</strong>:  If selected, you are choosing a Constant Bit Rate (CBR).  Choose if you have bandwidth concerns.  <br>If unchecked, you are using a Variable Bit Rate (VBR).</li><li>Frame type layout<br><strong class="text-strong">Maximum keyframe interval  (GOP)</strong>: 300<br><strong class="text-strong">Maximum B-frames between P-frames</strong>: 0 (only applies to Main profiles or above)</li><li><strong class="text-strong">Profiles</strong>: H.264 provides features that are encapsulated in profiles.<br><strong class="text-strong">Baseline</strong> restricts the encoder to certain basic features only.  Baseline can easily be played back on most devices.  Main and High add features on top of Baseline.  Baseline profiles were widely used for mobile devices.  However, now more and more mobile devices support Main or High profiles.<br><strong class="text-strong">Main</strong>:  B frames (above) are only allowed in the Main profile or above.  They can be used to save on bandwidth but harder to decode.  Widely used for web streaming.<br><strong class="text-strong">High</strong> profile is often used in broadcasting.  Used on high definition TVs.  Also adopted by the Blu-ray disc storage format.</li><li><strong class="text-strong">Presets</strong>: Presets are a collection of options that will provide a certain encoding speed to compression ratio.  A slower preset will provide better compression.  This means that, for example, if you target a certain file size or constant bit rate, you will achieve better quality with a slower preset. Similarly, for constant quality encoding, you will simply save bitrate by choosing a slower preset.</li></ul><span style="text-decoration:underline">Audio encoding</span><ul><li>Audio: AAC or MP3</li><li>Bitrate (kbps): 192</li></ul><br></div><strong class="text-strong">Streaming formats</strong><div style="margin-left:3em"><br>BI support M-JPEG, H.264 and other formats.  The <strong class="text-strong">Http interface -&gt; Direct image and video requests</strong> section in the Help file has details.<br><br><br></div><span style="font-size:150%;line-height:116%"><strong class="text-strong">Use cases</strong></span><br><br><strong class="text-strong">UI3 web endpoint</strong><div style="margin-left:3em"><br>This is one of the most common ways to access cameras remotely from a web browser (laptop) or mobile browser (phone).<br>Hit the Help button from Global settings -&gt; Web server tab for details.<br><br><a href="https://youtu.be/HX0o29_JD_8" class="postlink">The Blue Iris Web Interface webinar</a> walks through the user interface and all its features/functionality.<br><a href="viewtopic.php?f=12&amp;t=2716" class="postlink">See Web Interface (UI3) gotchas article</a> for learnings from past tickets.<br><br><br><strong class="text-strong">Large screen TVs</strong><br><br><div class="inline-attachment"><dl class="file"><dt class="attach-image"><img src="https://blueirissoftware.com/forum/download/file.php?id=2316" class="postimage" alt="ui3 tv.png" onclick="viewableArea(this);" /></dt></dl></div><br>Many users are using TVs to display their cameras.  Since these devices are usually on the LAN, they want to take advantage of their high resolution screens with high resolution video streams, since they know their network can handle the load.<br><br>With UI3, it is easy to experiment with higher and higher resolutions to determine what works best with your monitor.  Simply choose different resolutions by using the gear icon in the lower right corner.<br><br><div class="inline-attachment"><dl class="file"><dt class="attach-image"><img src="https://blueirissoftware.com/forum/download/file.php?id=2317" class="postimage" alt="web server_tv gear icon.png" onclick="viewableArea(this);" /></dt></dl></div><br><br><strong class="text-strong">One final comment.  If you have a monitor or TV that does NOT have internet connectivity a popular solution is to purchase an Amazon Firestick and run UI3 from there to the monitor.</strong>  Firestick + Silk browser + UI3 interface is the goto solution for many resellers when trying to display the cameras on a TV or monitor.<br><br><br><br></div><strong class="text-strong"><a name="Mobile apps">Mobile apps</a> (iOS / Android)</strong><br>The streams used by the mobile apps are set in Camera settings -&gt; Web server tab -&gt; Advanced page.  See <strong class="text-strong">Web server streams</strong> section above for details.  <strong class="text-strong">The default resolution for Streaming 0 is 720p.</strong>  <br><br><div class="inline-attachment"><dl class="file"><dt class="attach-image"><img src="https://blueirissoftware.com/forum/download/file.php?id=2546" class="postimage" alt="web server_default stream.png" onclick="viewableArea(this);" /></dt></dl></div><br>If the request from the app (720p default) is &lt;= the sub stream resolution, the sub stream is streamed.  Below are LAN/WAN suggestions that generally deliver smooth video based on higher/lower network bandwidth.<br><div style="margin-left:3em"><br><strong class="text-strong">LAN / WAN streaming profiles</strong><br><br>What's great about BI is it allows the ability to assign different streaming profiles for the LAN / WAN.  A common convention is to assign Profile 1 for LAN connections and Profile 2 for WAN connections.  <br><br>Video Pipeline: Camera video / feed -&gt; Decode -&gt; <strong class="text-strong">Encode</strong> -&gt; Endpoint (high resolution tablet / low resolution phone)<br><br>A tablet with a bigger screen and always connected to the LAN may have value in a higher resolution stream.  Being on the LAN, the network considerations are usually not as stringent either.<br><br>However, a WAN profile may entail a lower resolution stream.  Most WAN profiles are used by mobile phones with small screens.  Why unnecessarily send a stream with a high resolution that provides no additional value on a phone screen and also adds unnecessary load to the network and perhaps results in choppy video.<br><br><br><strong class="text-strong">LAN settings</strong><br><br>As stated above, according to our convention, LAN settings would be assigned to Streaming Profile 1<br><br>To get high resolution, smooth video, try the following settings for one of your web server video streams.<ul><li>Use variable bit rate instead of constant bit rate.  Unselect Rate control.  Crank up Quality value.  <strong class="text-strong">Gotcha:</strong> If network bandwidth too high, adjust.</li><li>Profile = high Uses more bells and whistles such as b-frames to optimize bandwidth while delivering quality.  <strong class="text-strong">Gotcha:</strong> If endpoint cannot decode, adjust.</li><li>Preset = veryfast.  Set to lowest to maximize quality.  <strong class="text-strong">Gotcha:</strong> If CPU utilization is high adjust.</li><li>Uncheck Resize output frame.  Send the full camera resolution to the device.  <strong class="text-strong">Gotcha:</strong> If network bandwidth spikes, adjust.  If the player at the endpoint starts to choke, adjust</li><li>b-frames are great for increasing quality and optimizing bandwidth.  <strong class="text-strong">Gotcha:</strong>  However, if you have a PTZ camera, b-frames can cause delays displaying the new view after a camera position changes.</li></ul><div class="inline-attachment"><dl class="file"><dt class="attach-image"><img src="https://blueirissoftware.com/forum/download/file.php?id=2532" class="postimage" alt="web server_LAN settings.png" onclick="viewableArea(this);" /></dt></dl></div><br>Don't forget to choose the appropriate stream for the mobile app.  Below is a reminder on how to do so.<br>Home tab -&gt; Gear icon -&gt; LAN.  Profile 1 is the LAN stream.<br><br><div class="inline-attachment"><dl class="file"><dt class="attach-image"><img src="https://blueirissoftware.com/forum/download/file.php?id=2261" class="postimage" alt="ios settings 320.png" onclick="viewableArea(this);" /></dt></dl></div><br><strong class="text-strong">WAN settings</strong><br><br>The below settings generally provide a good user experience on mobile phones connected to the WAN (cellular network).<br><br><div class="inline-attachment"><dl class="file"><dt class="attach-image"><img src="https://blueirissoftware.com/forum/download/file.php?id=2262" class="postimage" alt="encoder options.png" onclick="viewableArea(this);" /></dt></dl></div><br>Differences between WAN vs LAN:<ul><li>Switch from variable bit rate to constant bit rate to reduce network load.</li><li>Changed profile to superfast.  Trade quality for lower CPU load and processing time.</li><li>Resize frame.  Reduce resolution since stream is going to a small screen any way.</li></ul><br></div><strong class="text-strong">Multiple servers</strong><div style="margin-left:3em">Because BI is also a media server (RTSP server), you have the flexibility to pull video from one BI server to another.<br><br>Use case:  Enterprises with large deployments may have multiple servers because they have &gt;64 cameras.  However, they may want to pull video from one server to another.  Why?  Because suppose five cameras belong to a user group and 3 cameras reside on Server A and the other two reside on Server B.  In order to display all 5 cameras to the users belonging to this group, admins will pull the two cameras from Server B to Server A.  The admin can then create a camera group for the corresponding user group, thus providing one pane of glass for all the cameras belonging to the group.<br><br>In order to pull a camera from one server to another, first confirm Webcasting is enabled for the camera.<br><br><div class="inline-attachment"><dl class="file"><dt class="attach-image"><img src="https://blueirissoftware.com/forum/download/file.php?id=2263" class="postimage" alt="web server_webcast.png" onclick="viewableArea(this);" /></dt></dl></div><br>Attain the following information for the remote server:<ul><li>IP / Port of the web server</li><li>Username / password for a user that has access to the camera.</li><li>Pull camera or group stream<br>rtsp://ip:port/cam1 (camera)<br>rtsp://ip:port/groupname (group)</li></ul>In example below, I have a camera called ADF7.<br>I was testing locally so IP address was 127.0.0.1.  My web server is running on port 7000.<br><br><div class="inline-attachment"><dl class="file"><dt class="attach-image"><img src="https://blueirissoftware.com/forum/download/file.php?id=2264" class="postimage" alt="web server_rtsp feed.png" onclick="viewableArea(this);" /></dt></dl></div><br></div><strong class="text-strong">Embed video in your website</strong><div style="margin-left:3em">Many users like to share a camera on their website.  Below are two code snippets showing how to do so.  <br>Change url to meet your environment<ul><li>server is a placeholder for the ip address or hostname of your BI server</li><li>The web server listens on port 81 by default.  Use the port you specified if different from 81.</li><li>ADF_Cameras is a placeholder for the camera name or camera group name in your server.</li></ul><strong class="text-strong">&lt;iframe&gt; tag</strong><br><div class="codebox"><p>Code: </p><pre><code>&lt;iframe src="http://server:81/livestream.htm?cam=ADF_Cameras&amp;audio=0" allowfullscreen="true" width="640" height="360" /&gt;</code></pre></div><strong class="text-strong">&lt;img src&gt; tag</strong><br><div class="codebox"><p>Code: </p><pre><code>&lt;img src="http://server:81/mjpg/ADF_Cameras/video.mjpg?q=50&amp;w=640" style="width: 640px; height: 360px" /&gt;</code></pre></div>livestream.htm is a web page that loads a video player and feeds it an HLS stream from Blue Iris.  This is the best thing to embed in an iframe if you want minimal user interface functionality.  This method adds several seconds of video delay though, making it not ideal for all use cases.<br><br>The page source of livestream.htm includes the usage details.  It takes different URL parameters than UI3.<br><br>livestream.htm supported URL parameters:<ul><li>cam=short: Select camera or group with [short] name</li><li>autoplay=0: Disables autoplay.</li><li>audio=1: Unmute at startup. Also disables autoplay.</li><li>mode=2: Hide video player controls</li><li>mode=3: Use browser's standard video player controls</li></ul>Two other considerations when embedding streams:<br><br>1.  Authentication must be dealt with, either by enabling anonymous access or by turning off secure login and embedding credentials in the URL.<br><br>2. If the web site is hosted with HTTPS, the link to embed a video stream must also use HTTPS which will mean setting up stunnel or a similar secure proxy in front of Blue Iris.<br><br><br></div><strong class="text-strong">Embed video in your website via RTSP.Live site</strong><div style="margin-left:3em">If the above is too complicated, you can also try the <a href="https://youtu.be/0hef3pvmSqY" class="postlink">RTSP.Live free service</a>.<br><br><br></div><strong class="text-strong">YouTube - Streaming</strong><div style="margin-left:3em"><br>Use case: Pushing Blue Iris live camera stream(s) to YouTube's media server via RTMP.<br><br><div class="inline-attachment"><dl class="file"><dt class="attach-image"><img src="https://blueirissoftware.com/forum/download/file.php?id=983" class="postimage" alt="YouTube architecture.png" onclick="viewableArea(this);" /></dt></dl></div><br>YouTube provides URLs to connect to 3rd party software such as Blue Iris.<br><div class="inline-attachment"><dl class="file"><dt class="attach-image"><img src="https://blueirissoftware.com/forum/download/file.php?id=980" class="postimage" alt="youtube setup.png" onclick="viewableArea(this);" /></dt></dl></div><br>BI setup is just as simple.  Camera settings -&gt; Webcast tab.<br><div class="inline-attachment"><dl class="file"><dt class="attach-image"><img src="https://blueirissoftware.com/forum/download/file.php?id=981" class="postimage" alt="youtube BI settings.PNG" onclick="viewableArea(this);" /></dt></dl></div><br><em class="text-italics">You do need to supply the correct stream settings that will work with YouTube.</em><ul><li>Audio:  Set to AAC.  128 kbps</li><li>Max bitrate (kbps): 2048.  YouTube prefers 9500 kbps so go higher if network can support bandwidth.</li><li>Maximum keyframe interval (GOP): 60</li><li>Profile: main</li><li>Preset: superfast</li><li>Zero frame latency: Unchecked</li><li>Resize output frame width x height: Checked.  1280 x 720.  YouTube prefers 2560 x 1440 (double 1280 x 720) so go higher if network can support bandwidth and camera has the resolution.  No point increasing the resolution if your camera is 1 MP (1280 x 720).</li></ul>YouTube will provide Stream status feedback based off which, you can adjust BI settings further.<br><div class="inline-attachment"><dl class="file"><dt class="attach-image"><img src="https://blueirissoftware.com/forum/download/file.php?id=1031" class="postimage" alt="youtube stream feedback.png" onclick="viewableArea(this);" /></dt></dl></div><br></div><strong class="text-strong">Amazon Echo Show + Monocle</strong> Coming soon!<br><br><br><strong class="text-strong"><a name="Pro tip 1">Pro tip 1</a>: Leverage UI3 to help set optimal encoding settings on your mobile device</strong><div style="margin-left:3em"><br>Global settings -&gt; Web server tab -&gt; Advanced tab<br>Encoder profiles: &lt;streaming profile&gt; Configure button.<br><br>The encoder dialog box is a bit daunting.  What are good values for all those settings?<br>If like most, you are not well versed on encoder settings, use the UI3 interface for help!<br><br>The issue here is if you bring up a browser on your phone and go to the BI web interface, playback and live view work fine.  When doing the same through the app, the streaming is choppy, jittery etc.<ul><li>Test 1:  Need to make sure live stream and playback are first smooth on the BI Server.  Garbage in = Garbage out.</li><li>Test 2:  If you open a browser on the phone/tablet and go to the BI web interface (UI3), are the live view and playback a good experience.  If so, then you know the problem is not with the network.</li></ul>If you are still reading, then the problem probably means the player used by your device cannot handle the incoming stream well.  The short answer is to go to Global settings -&gt; Web server -&gt; Advanced -&gt; Encoder profiles (Choose Streaming 1 (LAN) or 2 (WAN)) -&gt; Configure dialog.  Use the below settings to start and see if they work.<br><br><br><div class="inline-attachment"><dl class="file"><dt class="attach-image"><img src="https://blueirissoftware.com/forum/download/file.php?id=2313" class="postimage" alt="encoder options orig.png" onclick="viewableArea(this);" /></dt></dl></div><br>Below are the changes from the default settings:<ul><li>First, I turned on Constant Bit Rate (CBR).  This settings caps the amount of data going to the player at 1024 kbps.</li><li>Next, I reduced the resolution to 856 x 480.  You are streaming to a mobile device, so reducing the resolution will probably have no affect on your viewing experience.  I played with "Retain aspect ratio within frame".  On iOS devices, the setting seemed fine.  But I noticed instability and crashes on some Android devices.  It does not really change/help the user experience, so my conclusion was to just leave it off unless required for another reason.</li><li>Finally, I set Hardware encode = No.  The hardware encoding often will not play on mobile players.  Best to encode using BI software.</li></ul>Reference:  If you want a deeper understanding of the settings in the encoder dialog or how encoding generally works, a great reference article was created by IPVM titled <a href="https://ipvm.com/reports/h264-mjpeg-bandwidth-quality-test#:~:text=The%20main%20difference%20between%20H,manually%20%28ergo%20Motion%20JPEG%29." class="postlink">"H.264 vs MJPEG - Quality and Bandwidth Tested"</a>.  If you are not familiar with IPVM, they are a great resource for research and information regarding surveillance and security cameras.<br><br><em class="text-italics">So how did I choose the values for the bit rate and resolution?</em><br><br>I cheated and used the expertise of the BI development team!  If you click on the gear icon in UI3 (lower right), you can select any predefined resolution and hit the pencil button up top.  You then see the encoding settings for the selected resolution.  I just copied those values into the encoder dialog on the console.<br><br><div class="inline-attachment"><dl class="file"><dt class="attach-image"><img src="https://blueirissoftware.com/forum/download/file.php?id=2314" class="postimage" alt="ui3-streaming-settings-trick_smaller.png" onclick="viewableArea(this);" /></dt></dl></div><br>Once I made the stream adjustments, I went to the mobile app settings and chose the appropriate settings for my LAN and WAN connections.<br><br><div class="inline-attachment"><dl class="file"><dt class="attach-image"><img src="https://blueirissoftware.com/forum/download/file.php?id=2315" class="postimage" alt="video streaming gotcha smaller.png" onclick="viewableArea(this);" /></dt></dl></div></div><p>Statistics: Posted by <a href="https://blueirissoftware.com/forum/memberlist.php?mode=viewprofile&amp;u=521">varghesesa</a> — Wed Feb 24, 2021 12:11 am</p><hr />
]]></content>
	</entry>
	</feed>
