Added hostname

This commit is contained in:
Rene Zeldenthuis
2022-09-20 16:00:11 +02:00
parent 3f310ca54d
commit 0023644f93
5 changed files with 20 additions and 5 deletions

View File

@@ -82,6 +82,10 @@
<div class="card bg-light mb-3"> <div class="card bg-light mb-3">
<h5 class="card-header">Network</h5> <h5 class="card-header">Network</h5>
<div class="card-body"> <div class="card-body">
<div class="row">
<div class="col-4">Host name:</div>
<div class="col-8">{{HostName}}</div>
</div>
<div class="row"> <div class="row">
<div class="col-4">Mac address:</div> <div class="col-4">Mac address:</div>
<div class="col-8">{{MacAddress}}</div> <div class="col-8">{{MacAddress}}</div>

View File

@@ -4,5 +4,5 @@
// ****************************************************************************** // ******************************************************************************
constexpr char file_data_index_html[] = "<!DOCTYPE html><html lang=en><head><meta charset=utf-8><meta name=viewport content=\"width=device-width, initial-scale=1, shrink-to-fit=no\"><link rel=stylesheet href=bootstrap.min.css><title>{{AppTitle}} v{{AppVersion}}</title></head><body><div class=container><h1 class=text-center>{{ThingName}}</h1><hr> {{#ConfigChanged}} <div class=\"alert alert-danger\" role=alert><p>The configuration has been changed.</p><p>It is recommended to restart the device.</p><button type=button class=\"btn btn-danger\" onclick=\"location.href='restart'\">Restart</button></div> {{/ConfigChanged}} <div class=row><div class=col-sm-6><div class=\"card bg-light mb-3\"><h5 class=card-header>ESP32</h5><div class=card-body><div class=row><div class=col-4>CPU model:</div><div class=col-8>{{ChipModel}} rev. {{ChipRevision}}</div></div><div class=row><div class=col-4>CPU speed:</div><div class=col-8>{{CpuFreqMHz}} Mhz</div></div><div class=row><div class=col-4>CPU cores:</div><div class=col-8>{{CpuCores}}</div></div><div class=row><div class=col-4>RAM size:</div><div class=col-8>{{HeapSize}}</div></div><div class=row><div class=col-4>PSRAM size:</div><div class=col-8>{{PsRamSize}}</div></div><div class=row><div class=col-4>Flash size:</div><div class=col-8>{{FlashSize}}</div></div></div></div></div><div class=col-sm-6><div class=\"card bg-light mb-3\"><h5 class=card-header>Diagnostics</h5><div class=card-body><div class=row><div class=col-4>Uptime:</div><div class=col-8>{{Uptime}}</div></div><div class=row><div class=col-4>RTSP sessions:</div><div class=col-8>{{NumRTSPSessions}}</div></div><div class=row><div class=col-4>Free heap:</div><div class=col-8>{{FreeHeap}}</div></div><div class=row><div class=col-4>Max free block:</div><div class=col-8>{{MaxAllocHeap}}</div></div></div></div></div></div><div class=row><div class=col-sm-6><div class=\"card bg-light mb-3\"><h5 class=card-header>Network</h5><div class=card-body><div class=row><div class=col-4>Mac address:</div><div class=col-8>{{MacAddress}}</div></div><div class=row><div class=col-4>Wifi mode:</div><div class=col-8>{{WifiMode}}</div></div><div class=row><div class=col-4>Access point:</div><div class=col-8>{{AccessPoint}}</div></div><div class=row><div class=col-4>Signal strength:</div><div class=col-8>{{SignalStrength}} dbm</div></div><div class=row><div class=col-4>IPv4 address:</div><div class=col-8>{{IpV4}}</div></div><div class=row><div class=col-4>IPv6 address:</div><div class=col-8>{{IpV6}}</div></div> {{#NetworkState.ApMode}} <div class=\"mt-4 alert alert-warning\" role=alert><p>Not connected to an access point. Consider configuring the access point.</p></div> {{/NetworkState.ApMode}} {{#NetworkState.OnLine}} <div class=\"mt-4 alert alert-success\" role=alert><p>Connected to the access point</p></div> {{/NetworkState.OnLine}} </div></div></div><div class=col-sm-6><div class=\"card bg-light mb-3\"><h5 class=card-header>Settings</h5><div class=card-body><div class=row><div class=col-4>Camera type:</div><div class=col-8>{{CameraType}}</div></div><div class=row><div class=col-4>Frame rate:</div><div class=col-8>{{FrameDuration}} ms ({{FrameFrequency}} f/s)</div></div><div class=row><div class=col-4>Frame size:</div><div class=col-8>{{FrameSize}}</div></div><div class=row><div class=col-4>Frame buffer location:</div><div class=col-8>{{FrameBufferLocation}}</div></div><div class=row><div class=col-4>Frame buffers:</div><div class=col-8>{{FrameBuffers}}</div></div><div class=row><div class=col-4>JPEG quality:</div><div class=col-8>{{JpegQuality}} (0-100)</div></div> {{#CameraInitialized}} <div class=\"mt-4 alert alert-success\" role=alert><p>Camera was initialized successfully!</p></div> {{/CameraInitialized}} {{^CameraInitialized}} <div class=\"mt-4 alert alert-danger\" role=alert><p>Failed to initialize the camera!</p><p>Result: {{CameraInitResultText}} ({{CameraInitResult}})</p><p>Please check hardware or correct the camera settings and restart.</p><button type=button class=\"btn btn-danger\" onclick=\"location.href='restart'\">Restart</button></div> {{/CameraInitialized}} </div></div></div></div><div class=row><div class=\"card bg-light mb-3\"><h5 class=card-header>Camera stream</h5><div class=card-body></p>The camera stream can be found at the following location: <a href=rtsp://{{ThingName}}.local:{{RtspPort}}/mjpeg/1>rtsp://{{ThingName}}.local:{{RtspPort}}/mjpeg/1</a></p><img class=\"rounded mx-auto d-block\" src=snapshot alt=\"Camera image\" width=25%></div></div></div></div><div class=\"d-grid gap-2 col-6 mx-auto\"><button type=button class=\"btn btn-lg btn-warning\" onclick=\"location.href='config'\">Settings</button></div></div></body></html>"; constexpr char file_data_index_html[] = "<!DOCTYPE html><html lang=en><head><meta charset=utf-8><meta name=viewport content=\"width=device-width, initial-scale=1, shrink-to-fit=no\"><link rel=stylesheet href=bootstrap.min.css><title>{{AppTitle}} v{{AppVersion}}</title></head><body><div class=container><h1 class=text-center>{{ThingName}}</h1><hr> {{#ConfigChanged}} <div class=\"alert alert-danger\" role=alert><p>The configuration has been changed.</p><p>It is recommended to restart the device.</p><button type=button class=\"btn btn-danger\" onclick=\"location.href='restart'\">Restart</button></div> {{/ConfigChanged}} <div class=row><div class=col-sm-6><div class=\"card bg-light mb-3\"><h5 class=card-header>ESP32</h5><div class=card-body><div class=row><div class=col-4>CPU model:</div><div class=col-8>{{ChipModel}} rev. {{ChipRevision}}</div></div><div class=row><div class=col-4>CPU speed:</div><div class=col-8>{{CpuFreqMHz}} Mhz</div></div><div class=row><div class=col-4>CPU cores:</div><div class=col-8>{{CpuCores}}</div></div><div class=row><div class=col-4>RAM size:</div><div class=col-8>{{HeapSize}}</div></div><div class=row><div class=col-4>PSRAM size:</div><div class=col-8>{{PsRamSize}}</div></div><div class=row><div class=col-4>Flash size:</div><div class=col-8>{{FlashSize}}</div></div></div></div></div><div class=col-sm-6><div class=\"card bg-light mb-3\"><h5 class=card-header>Diagnostics</h5><div class=card-body><div class=row><div class=col-4>Uptime:</div><div class=col-8>{{Uptime}}</div></div><div class=row><div class=col-4>RTSP sessions:</div><div class=col-8>{{NumRTSPSessions}}</div></div><div class=row><div class=col-4>Free heap:</div><div class=col-8>{{FreeHeap}}</div></div><div class=row><div class=col-4>Max free block:</div><div class=col-8>{{MaxAllocHeap}}</div></div></div></div></div></div><div class=row><div class=col-sm-6><div class=\"card bg-light mb-3\"><h5 class=card-header>Network</h5><div class=card-body><div class=row><div class=col-4>Host name:</div><div class=col-8>{{HostName}}</div></div><div class=row><div class=col-4>Mac address:</div><div class=col-8>{{MacAddress}}</div></div><div class=row><div class=col-4>Wifi mode:</div><div class=col-8>{{WifiMode}}</div></div><div class=row><div class=col-4>Access point:</div><div class=col-8>{{AccessPoint}}</div></div><div class=row><div class=col-4>Signal strength:</div><div class=col-8>{{SignalStrength}} dbm</div></div><div class=row><div class=col-4>IPv4 address:</div><div class=col-8>{{IpV4}}</div></div><div class=row><div class=col-4>IPv6 address:</div><div class=col-8>{{IpV6}}</div></div> {{#NetworkState.ApMode}} <div class=\"mt-4 alert alert-warning\" role=alert><p>Not connected to an access point. Consider configuring the access point.</p></div> {{/NetworkState.ApMode}} {{#NetworkState.OnLine}} <div class=\"mt-4 alert alert-success\" role=alert><p>Connected to the access point</p></div> {{/NetworkState.OnLine}} </div></div></div><div class=col-sm-6><div class=\"card bg-light mb-3\"><h5 class=card-header>Settings</h5><div class=card-body><div class=row><div class=col-4>Camera type:</div><div class=col-8>{{CameraType}}</div></div><div class=row><div class=col-4>Frame rate:</div><div class=col-8>{{FrameDuration}} ms ({{FrameFrequency}} f/s)</div></div><div class=row><div class=col-4>Frame size:</div><div class=col-8>{{FrameSize}}</div></div><div class=row><div class=col-4>Frame buffer location:</div><div class=col-8>{{FrameBufferLocation}}</div></div><div class=row><div class=col-4>Frame buffers:</div><div class=col-8>{{FrameBuffers}}</div></div><div class=row><div class=col-4>JPEG quality:</div><div class=col-8>{{JpegQuality}} (0-100)</div></div> {{#CameraInitialized}} <div class=\"mt-4 alert alert-success\" role=alert><p>Camera was initialized successfully!</p></div> {{/CameraInitialized}} {{^CameraInitialized}} <div class=\"mt-4 alert alert-danger\" role=alert><p>Failed to initialize the camera!</p><p>Result: {{CameraInitResultText}} ({{CameraInitResult}})</p><p>Please check hardware or correct the camera settings and restart.</p><button type=button class=\"btn btn-danger\" onclick=\"location.href='restart'\">Restart</button></div> {{/CameraInitialized}} </div></div></div></div><div class=row><div class=\"card bg-light mb-3\"><h5 class=card-header>Camera stream</h5><div class=card-body></p>The camera stream can be found at the following location: <a href=rtsp://{{ThingName}}.local:{{RtspPort}}/mjpeg/1>rtsp://{{ThingName}}.local:{{RtspPort}}/mjpeg/1</a></p><img class=\"rounded mx-auto d-block\" src=snapshot alt=\"Camera image\" width=25%></div></div></div></div><div class=\"d-grid gap-2 col-6 mx-auto\"><button type=button class=\"btn btn-lg btn-warning\" onclick=\"location.href='config'\">Settings</button></div></div></body></html>";
constexpr char file_data_restart_html[] = "<!DOCTYPE html><html lang=en><head><meta charset=utf-8><meta name=viewport content=\"width=device-width, initial-scale=1, shrink-to-fit=no\"><link rel=stylesheet href=bootstrap.min.css><meta http-equiv=refresh content=\"30;url=/index.html\"><title>{{AppTitle}} v{{AppVersion}}</title></head><body><div class=container><h1 class=text-center>{{ThingName}}</h1><hr><div class=\"jumbotron bg-light\"><h1 class=\"display-4 text-center\">Restart</h1><p class=\"lead text-center\">The device is restarting.</p><hr class=\"my-4 \"><p class=text-center>In some cases, the device requires a hard reset (power cycle).</p><p class=text-center>If this page takes longer than a minute, consider performing a power cycle.</p><div class=\"d-flex justify-content-center\"><div class=\"spinner-border text-danger\" role=status><span class=visually-hidden>Restarting...</span></div></div></div></div></body></html>"; constexpr char file_data_restart_html[] = "<!DOCTYPE html><html lang=en><head><meta charset=utf-8><meta name=viewport content=\"width=device-width, initial-scale=1, shrink-to-fit=no\"><link rel=stylesheet href=bootstrap.min.css><meta http-equiv=refresh content=\"30;url=/index.html\"><title>{{AppTitle}} v{{AppVersion}}</title></head><body><div class=container><h1 class=text-center>{{ThingName}}</h1><hr><div class=\"jumbotron bg-light\"><h1 class=\"display-4 text-center\">Restart</h1><p class=\"lead text-center\">The device is restarting.</p><hr class=\"my-4 \"><p class=text-center>In some cases, the device requires a hard reset (power cycle).</p><p class=text-center>If this page takes longer than a minute, consider performing a power cycle.</p><div class=\"d-flex justify-content-center\"><div class=\"spinner-border text-danger\" role=status><span class=visually-hidden>Restarting...</span></div></div></div></div></body></html>";

File diff suppressed because one or more lines are too long

View File

@@ -13,6 +13,11 @@ platform = espressif32
board = esp32cam board = esp32cam
framework = arduino framework = arduino
#upload_protocol = espota
#upload_port = esp32-083af2a72340.local
#upload_flags =
# --auth=ESP32CAM-RTSP
monitor_speed = 115200 monitor_speed = 115200
monitor_rts = 0 monitor_rts = 0
monitor_dtr = 0 monitor_dtr = 0

View File

@@ -60,6 +60,11 @@ void handle_root()
if (iotWebConf.handleCaptivePortal()) if (iotWebConf.handleCaptivePortal())
return; return;
// Format hostname
auto hostname = "esp32-" + WiFi.macAddress();
hostname.replace(":", "");
// Wifi Modes
const char *wifi_modes[] = {"NULL", "STA", "AP", "STA+AP"}; const char *wifi_modes[] = {"NULL", "STA", "AP", "STA+AP"};
const template_variable_t substitutions[] = { const template_variable_t substitutions[] = {
@@ -82,6 +87,7 @@ void handle_root()
{"MaxAllocHeap", format_memory(ESP.getMaxAllocHeap())}, {"MaxAllocHeap", format_memory(ESP.getMaxAllocHeap())},
{"NumRTSPSessions", camera_server != nullptr ? String(camera_server->num_connected()) : "N/A"}, {"NumRTSPSessions", camera_server != nullptr ? String(camera_server->num_connected()) : "N/A"},
// Network // Network
{"HostName", hostname},
{"MacAddress", WiFi.macAddress()}, {"MacAddress", WiFi.macAddress()},
{"AccessPoint", WiFi.SSID()}, {"AccessPoint", WiFi.SSID()},
{"SignalStrength", String(WiFi.RSSI())}, {"SignalStrength", String(WiFi.RSSI())},
@@ -145,12 +151,12 @@ void handle_snapshot()
// Make a copy in memory to prevent interaction with RTSP // Make a copy in memory to prevent interaction with RTSP
cam.run(); cam.run();
auto fb_len = cam.getSize(); auto fb_len = cam.getSize();
auto fb = memcpy(new uint8_t[cam.getSize()], cam.getfb(), fb_len); auto fb = (const char*)memcpy(new uint8_t[cam.getSize()], cam.getfb(), fb_len);
web_server.sendHeader("Cache-Control", "no-cache, no-store, must-revalidate"); web_server.sendHeader("Cache-Control", "no-cache, no-store, must-revalidate");
web_server.setContentLength(fb_len); web_server.setContentLength(fb_len);
web_server.send(200, "image/jpeg", ""); web_server.send(200, "image/jpeg", "");
web_server.sendContent(reinterpret_cast<const char *>(fb), fb_len); web_server.sendContent(fb, fb_len);
delete[] fb; delete []fb;
} }
void on_config_saved() void on_config_saved()