AIBOX OS includes a feature to view detection result images in real-time through a web browser.
This page explains how to use this feature, which is disabled by default.
Make sure you are logged into AIBOX OS and are ready to check and edit files.
AIBOX OS has Nginx, a lightweight HTTP server, pre-installed. In Nginx's public directory (/var/www/html), there is a built-in preview.html for viewing detection result images.
preview.html is available here
This preview.html contains code that reads and displays result.jpg in the same directory every 100 milliseconds.
By updating detection result images as result.jpg, the detection program enables real-time viewing of detection results in a web browser.
By default, this feature (Nginx HTTP delivery) is disabled. To use this feature, you need to enable it.
Since you will be modifying Nginx settings, if you want to persist the changes, first disable the RAM disk using the ramdisk command.
※If you want to temporarily test the feature, you can leave the RAM disk enabled. In that case, the changes will be reverted when you power off the AIBOX.
This is a built-in AIBOX OS command for disabling or re-enabling RAM disk functionality.
Before making OS configuration changes (such as changing passwords, enabling SSH, or connecting to WiFi), use the following command to disable the RAM disk, then make your changes. (AIBOX will restart once)
$ sudo ramdisk disable
After making configuration changes, re-enable the RAM disk. (AIBOX will restart once)
$ sudo ramdisk enable
To modify Nginx settings, edit the following file:
/etc/nginx/sites-available/default
$ sudo nano /etc/nginx/sites-available/default
Uncomment the server{} section in this file and save it.
server {
listen 443 ssl;
listen [::]:443;
(omitted)
}
#------------------------------------
# For Preview
# Uncomment this section to enable
# object detection preview
#
# Access URL
# http://xxx.xxx.xxx.xxx/preview.html
#
#------------------------------------
(Uncomment the section below)
# server {
# listen 80 default_server;
# listen [::]:80 default_server;
#
# root /var/www/html;
#
# location / {
# try_files $uri $uri/ =404;
# }
# }
In the nano editor, use Ctrl+O to save and Ctrl+X to exit.
The configuration file also contains settings for the API server (port 443) used for app connections.
Do not modify these settings as they may prevent app connectivity.
After saving the configuration file, restart Nginx to load the new settings:
$ sudo systemctl restart nginx.service
Now, open a web browser on another PC and try accessing the AIBOX.
If the detection result preview image is displayed, you're successful!
http://[AIBOX IP Address]/preview.html
This feature uses HTTP delivery without authentication.
As it is primarily intended for development purposes, please be careful about where you expose it.
This preview feature works by having the detection program periodically update /var/www/html/result.jpg.
With the standard built-in AI detection program, the save process is performed at the end of the main function.
# Save preview image for result verification
# PREVIEW_IMAGE_PATH is /var/www/html/result.jpg
with open(PREVIEW_IMAGE_PATH, 'wb') as f:
f.write(frame)
Custom detection programs can also use detection result image preview by implementing similar save logic.