Category: Product Updates

In the realm of smart security and audiovisual control, two standout solutions – DoorBird and AVstudio – come together to create a seamless, powerful experience. DoorBird, crafted by Bird Home Automation GmbH, brings cutting-edge IP video intercoms to your doorstep, while AVstudio, developed by AVgator Inc., offers a robust platform to manage it all.

In this blog post, we’ll explore how these two innovations pair up, with insights from our DoorBird Integration Guide, and why this combo is a must-have for homes and businesses alike.

Meet DoorBird: The Intercom Innovator

Hailing from Germany, Bird Home Automation GmbH has redefined door communication with DoorBird. These aren’t your average doorbells – they’re IP video door stations packed with features:

• Crystal-clear video and two-way audio to see and speak with visitors.
• Remote access via the DoorBird app, letting you manage your door from anywhere.
• Smart integrations with platforms like Crestron, Control4, and, of course, AVstudio.

Whether you’re screening deliveries at home or managing access for a multi-tenant building, DoorBird delivers security with style and sophistication.

Enter AVstudio: The Control Mastermind

On the software side, AVgator Inc., a Crestron Service Provider, brings us AVstudio – a game-changing platform for AV and smart system integration. AVstudio (accessible at avstudio.app) empowers users to:

• Design custom interfaces with drag-and-drop ease.
• Control a range of devices – like DoorBird intercoms – from one hub.
• Automate workflows for a smarter, more efficient setup.

Think of AVstudio as the brain that ties your tech together, making it ideal for integrators and end-users who want total control without the complexity.

The Power of Integration

So, what happens when DoorBird and AVstudio join forces? You get a security and control solution that’s greater than the sum of its parts. Our DoorBird Integration Guide walks you through the process, highlighting:

• Simple Setup: Connect your DoorBird device to AVstudio in just a few steps.
• Unified Control: View live feeds, talk to visitors, and unlock doors—all from AVstudio’s interface.
• Tailored Experience: Customize the system for a single home or a sprawling commercial space.
• Reliability: Pair DoorBird’s top-tier hardware with AVstudio’s intuitive software for a setup you can trust.

This integration isn’t just about convenience—it’s about elevating how you interact with your space.

Why It’s a Game-Changer

Imagine this: A visitor rings your DoorBird intercom. You check the video feed on your phone via UI created in AVstudio, confirm it’s your guest, and unlock the door – all without leaving your couch or your office halfway across town.

For businesses, it’s even more powerful: manage multiple entrances, automate access, and keep everything in sync with your AV systems. It’s smart security, simplified.

Get Started Today

Ready to bring this dynamic duo to your doorstep? Dive into the full DoorBird Integration Guide in the AVstudio Knowledge Base. You’ll find everything you need – step-by-step instructions, tips, and best practices – to make the most of DoorBird and AVstudio.

Whether you’re a tech-savvy homeowner or a professional integrator, this integration is your ticket to a smarter, safer environment.

Final Thoughts

Bird Home Automation GmbH and AVgator Inc. have each brought something special to the table with DoorBird and AVstudio. Together, they’re transforming how we secure and manage our spaces.

Visit doorbird.com to explore the hardware, and check out avstudio.app for the software that ties it all together.

Let us know how this integration works for you—we’d love to hear your story!

Proxy servers play a vital role in managing and routing network traffic, offering solutions for load balancing, caching, and enhanced security.

Our proxy servers is meticulously designed to be lightweight, efficient, and highly customizable. It supports both HTTP and HTTPS protocols and comes equipped with features like keep-alive requests, logging, and robust CORS handling. Additionally, it allows you to use third-party APIs directly in the UI or AVgator®Studio, even if those APIs don’t support CORS or HTTPS.

Key Features

• Cross-Platform Compatibility: Supports Windows, macOS, Raspberry Pi, and Linux.
• HTTP and HTTPS Support: Handles both HTTP and HTTPS traffic.
• Keep-Alive Requests: Maintain uninterrupted connections automatically.
• Configurable Logging: Supports logging to a file with rotation based on file size.
• Dynamic Configuration Reloading: Automatically reloads configuration changes without restarting the server.
• CORS Handling: Seamlessly handle cross-origin requests, preflight requests, and more.

Configuration

The proxy server is configured using a JSON file. Here’s an example configuration file (config.json):

{
	"hosts": [
		{
			"prefix": "hostone",
			"auth": {
				"type": "crestronHome",
				"token": "NgPkQG2zc5Wn",
				"url": "https://192.168.254.227/cws/api/login"
			},
			"url": "https://192.168.254.227"
		},
		{
			"prefix": "hosttwo",
			"url": "http://192.168.254.203",
			"autonomic": {
				"heartbeat_url":
				"http://192.168.254.203/api/?clientId=0d933545-fa6a-47fc-90de-0f20db9745ab"
			}
		}
	],
	"mode": "debug",
	"log-file": "/var/log/proxy.log"
}

Detailed Explanation of the Configuration

• mode: Specifies the mode of the application. It can be either debug or production. If not specified, it defaults to production.
• log-file: Specifies the log file name and location. If not specified, it defaults to proxy.log in the binary’s directory.
• hosts: An array of host configurations. Each host configuration includes:
  • prefix: The prefix for the host. Requests with this prefix will be proxied to the specified URL.
  • auth: The authentication configuration. If the type is crestronHome, the token and url fields are required. crestronHome is a specific type of authentication used for Crestron Home systems.
  • autonomic: The autonomic configuration. If specified, keepalive requests will be sent to the heartbeat_url every 20 seconds. autonomic refers to the Autonomic music server
  • url: The URL to proxy requests to.

Running the Proxy Server

You can run the proxy server with the following command:

./proxyserver

Make sure the configuration file (config.json) and SSL certificates are in the appropriate directories as expected by the program.

You can choose our prepared Proxy Server for your OS to create AV projects in AVStudio.

RTSP (Real-Time Streaming Protocol) is widely used for live video streaming, especially in IP cameras and surveillance systems. However, RTSP isn’t natively supported by most web browsers, making it less versatile for modern applications.

On the other hand, HLS (HTTP Live Streaming) is a browser-friendly protocol supported across devices and platforms.

By leveraging FFmpeg and Nginx, you can efficiently repack RTSP streams into HLS for seamless streaming. Here’s how this powerful duo works.

What is FFmpeg?

FFmpeg is a robust multimedia framework capable of processing, converting, and streaming audio and video in various formats. It plays a crucial role in transforming RTSP streams into HLS playlists (.m3u8).

What is Nginx?

Nginx is a high-performance web server and reverse proxy that serves as the delivery mechanism for the HLS files generated by FFmpeg. It ensures efficient file hosting, supports cross-origin requests, and scales to handle many simultaneous viewers.

How FFmpeg Helps Repack RTSP to HLS

FFmpeg repackages the RTSP stream into the HLS format without re-encoding, which saves computational resources and reduces latency.

Use FFmpeg to process the RTSP input and generate HLS segments.

Example Command

ffmpeg -i rtsp://admin:Multimedia@10.14.25.151:8554/ch01 \
       -c:v copy -c:a copy -f hls -hls_time 1 -hls_list_size 6 \
       -hls_time 1 -hls_list_size 6 -hls_flags delete_segments \
       /var/www/streams/AV05SD082a.m3u8

Key Parameters:

• -c:v copy:Copies the video codec without re-encoding.
• -c:a copy:Copies the audio codec without re-encoding.
• -hls_time:Sets the duration (in seconds) of each HLS segment.
• -hls_list_size:Defines the number of segments in the playlist.

FFmpeg continuously processes the RTSP stream and generates a live.m3u8 playlist and media segments.

How Nginx Serves HLS Streams

Nginx acts as the web server that delivers the HLS files to clients. Configure Nginx to serve HLS files with CORS support.

Configuration File Location: /etc/nginx/sites-enabled/strapi.conf

Sample Configuration

server {
    listen 80;
    server_name 10.14.25.18;

    location /streams/ {
        types {
            application/vnd.apple.mpegurl m3u8;
            video/mp2t ts;
        }
        root /var/www;
        add_header Cache-Control no-cache;
        add_header Access-Control-Allow-Origin *;
    }
}

• The types block specifies MIME types for .m3u8 and .ts files.
• The Access-Control-Allow-Origin * header supports cross-origin requests.

Restart Nginx after configuration

sudo systemctl restart nginx

Clients can now access the HLS stream through a URL like:

http://10.14.25.18/streams/stream.m3u8

Conclusion

Repacking RTSP streams into HLS using FFmpeg and Nginx is an effective solution for delivering high-quality video streams to a wide range of devices. This setup ensures compatibility, scalability, and efficiency, making it ideal for applications like IP camera streaming, live broadcasting, or multimedia projects.

With HLS support, AV Studio allows developers to create projects without the need for third-party plug-ins. Just integrate into your project AV Studio a video element that supports HLS playback.

Cross-Origin Resource Sharing (CORS) is a vital security mechanism in web technologies, including HTML5-based interfaces created with Crestron Construct, Crestron CH5, or AVGator® Studio for Crestron control systems. It ensures that requests from a control interface (e.g., a Crestron panel or Crestron One on iPad) to external servers or APIs are handled securely.

While similar to traditional web applications, the use of CORS in Crestron interfaces has its specific challenges and solutions due to the hardware and network environments involved.

How CORS Works

When an HTML5 interface sends a request to an external API or server, the browser enforces the same-origin policy. This policy blocks requests to different domains, ports, or protocols unless the server explicitly allows it via headers like Access-Control-Allow-Origin. If these headers are not present or invalid, the response is blocked.

Simple vs. Preflighted Requests

Simple Requests:These include GET, POST, or HEAD requests with safe headers. In a smart home environment, for example, fetching status updates from an API for lighting control can succeed if the third-party API responds with an appropriate Access-Control-Allow-Origin header.

Non-Simple Requests (Preflighted):If the request includes custom headers or uses HTTP methods like PUT or DELETE, the browser sends a preflight OPTIONS request. This checks if the server permits such requests by examining headers like Access-Control-Allow-Methods and Access-Control-Allow-Headers. The preflight is critical for ensuring that interfaces can safely interact with third-party APIs.

Example Use Case: Lighting Control

Suppose you are building an interface to control room lighting, and the system relies on a third-party API for device statuses. The HTML5 interface, running on the Crestron touch panel, sends a POST request to the API for status updates:

Preflight Request:The browser sends an OPTIONS request to check if the server permits such a request. The API must respond with headers like:

• Access-Control-Allow-Origin: *
• Access-Control-Allow-Methods: POST

Actual Request:If the server allows it, the interface proceeds with the POST request, and the response is received and displayed in the control panel.

Why Proxies Are Important in GUI Development

During development, CORS issues arise when the interface connects to APIs on different origins. For instance:

• The HTML5 interface running on https://avstudio.app may attempt to communicate with an API hosted at http://192.168.4.4
• Without proper CORS configuration on the server, the browser will block these requests.

A proxy server helps circumvent this by acting as an intermediary. Developers can route requests through the proxy, which communicates with the API and ensures the necessary CORS headers are included. This approach simplifies testing and allows the interface to function seamlessly without requiring server-side configuration changes.

🔍 Demonstration: Integrating Crestron Home with AVgator® Studio using Data Sources

In this video, we demonstrate how AVgator® Studio interacts with Crestron Home using data sources to enable seamless control and monitoring. You’ll see how changes made in Crestron Home reflect instantly in AVgator® Studio, showcasing the power of integration.

💡 What’s Covered in This Demonstration:

• Connecting to the Crestron Home API and retrieving room data

• Controlling lights directly from AVgator® Studio

• Renaming a room in the Crestron Home App and reflecting the change in AVgator® Studio

• Explanation of data sources as structured lists with parameters for control and automation

• Overview of CORS proxy servers and their role in enabling custom UI designs

• How AVgator®Studio supports custom UI development for Crestron Home

🚀 Want to Build Custom UIs for Crestron Home?

It’s possible to create your own custom designs using AVgator®Studio and a proxy server. Contact us to get started with an example setup, or stay tuned for appliance-based solutions coming soon!

💬 Need Help? Reach Out Anytime!

#CrestronHome #AVgatorStudio #CustomUIDesign #HomeAutomation #APIDemonstration #AVIntegration