Hosting OpenBeken Webapp Locally with Docker on Various Operating Systems
Docker Image for OpenBeken IoT Web App Hosting
source code: OpenBekenIOT Web App
Designed for hosting an IoT web application, this Docker image initiates from a simple webpage at http://(IP):PORT/ on the device. The device redirects to a default repository, but with device configuration, local hosting on your LAN is possible for enhanced security.
Key Components:
Web App Structure:
The app root page loads startup.js, initiating VueJS.
startup.js further loads myComponent.vue, the core of the web app.
Each page of the app is a separate VueJS Single File Component (SFC).
Versatility in Hosting:
Redirects to a default repository, configurable for local hosting on LAN or from the device filesystem.
Rich Features:
Over-The-Air (OTA) updates for seamless enhancements.
Device filesystem management for efficient file handling.
Device configuration for personalized settings.
Logging capabilities for effective monitoring.
This Docker image streamlines the deployment of an OpenBeken IoT web application, offering flexibility in hosting options and a robust feature set for an enriched user experience.
Easy Local Web App Hosting with Docker!
Ready to effortlessly share files locally? This Docker image, crafted with Alpine, Node, and OpenBeken magic, makes it a breeze! Whether you're on Linux or Windows, turn your computer/server into a 24/7 host.
Simple Steps:
1. Get Ready:
Make sure Docker is installed on your system.
2. Run Docker Magic:
Log in with Docker execution privileges.
Run this command:
This downloads the image and launches the container, exposing port 7231. Adjust the port according to your preference, ensuring alignment with application settings.
3. Change URI address of hosted files(In my case files are hosted on computer with hostname: server):
Please visit the specified page, and following that, proceed to adjust the settings on your device at the provided address (in this instance, it is the hostname of my IoT OpenBeken device).
Here, the address of our local server, which stores files for us, is entered.
4. Check the results
With those steps completed, the configuration process should now be finished.
Upon successful execution of the plan, the following is expected in the web browser:
On the server side within the Docker/container environment:
If there are significant updates to the web app, the Docker image will be promptly refreshed to ensure users can benefit from the latest features and improvements. If you have any further questions or need assistance in the future, feel free to reach out.
[EDIT]
Different flavours of images available:
Based on image: node:18-alpine
Based on npm http-server: YES
Image approx. size(compressed): 73 MB
Architecture available: amd64, arm32, arm64
Stand-alone version with Web App included: YES
Update of Web App by pulling new image: YES
Required Internet connection during container starts: NO
Based on image: alpine:3.15
Based on npm http-server: YES
Image approx. size(compressed): 29 MB
Architecture available: amd64, arm32, arm64
Stand-alone version with Web App included: YES
Update of Web App by pulling new image: YES
Required Internet connection during container starts: NO
Based on image: node:alpine
Based on npm http-server: YES
Image approx. size(compressed): 53 MB
Architecture available: amd64, arm32, arm64
Stand-alone version with Web App included: NO
Update of Web App by restart of container: YES
Required Internet connection during container starts: YES
Based on image: alpine
Based on Apache Web Server: YES
Image approx. size(compressed): 9 MB
Architecture available: amd64, arm32, arm64
Stand-alone version with Web App included: NO
Update of Web App by restart of container: YES
Required Internet connection during container starts: YES
source code: OpenBekenIOT Web App
Designed for hosting an IoT web application, this Docker image initiates from a simple webpage at http://(IP):PORT/ on the device. The device redirects to a default repository, but with device configuration, local hosting on your LAN is possible for enhanced security.
Key Components:
Web App Structure:
The app root page loads startup.js, initiating VueJS.
startup.js further loads myComponent.vue, the core of the web app.
Each page of the app is a separate VueJS Single File Component (SFC).
Versatility in Hosting:
Redirects to a default repository, configurable for local hosting on LAN or from the device filesystem.
Rich Features:
Over-The-Air (OTA) updates for seamless enhancements.
Device filesystem management for efficient file handling.
Device configuration for personalized settings.
Logging capabilities for effective monitoring.
This Docker image streamlines the deployment of an OpenBeken IoT web application, offering flexibility in hosting options and a robust feature set for an enriched user experience.
Easy Local Web App Hosting with Docker!
Ready to effortlessly share files locally? This Docker image, crafted with Alpine, Node, and OpenBeken magic, makes it a breeze! Whether you're on Linux or Windows, turn your computer/server into a 24/7 host.
Simple Steps:
1. Get Ready:
Make sure Docker is installed on your system.
2. Run Docker Magic:
Log in with Docker execution privileges.
Run this command:
Code: Bash
This downloads the image and launches the container, exposing port 7231. Adjust the port according to your preference, ensuring alignment with application settings.
3. Change URI address of hosted files(In my case files are hosted on computer with hostname: server):
Please visit the specified page, and following that, proceed to adjust the settings on your device at the provided address (in this instance, it is the hostname of my IoT OpenBeken device).
Code: Bash
Here, the address of our local server, which stores files for us, is entered.
4. Check the results
With those steps completed, the configuration process should now be finished.
Upon successful execution of the plan, the following is expected in the web browser:
On the server side within the Docker/container environment:
If there are significant updates to the web app, the Docker image will be promptly refreshed to ensure users can benefit from the latest features and improvements. If you have any further questions or need assistance in the future, feel free to reach out.
[EDIT]
Different flavours of images available:
Code: Bash
Based on image: node:18-alpine
Based on npm http-server: YES
Image approx. size(compressed): 73 MB
Architecture available: amd64, arm32, arm64
Stand-alone version with Web App included: YES
Update of Web App by pulling new image: YES
Required Internet connection during container starts: NO
Code: Bash
Based on image: alpine:3.15
Based on npm http-server: YES
Image approx. size(compressed): 29 MB
Architecture available: amd64, arm32, arm64
Stand-alone version with Web App included: YES
Update of Web App by pulling new image: YES
Required Internet connection during container starts: NO
Code: Bash
Based on image: node:alpine
Based on npm http-server: YES
Image approx. size(compressed): 53 MB
Architecture available: amd64, arm32, arm64
Stand-alone version with Web App included: NO
Update of Web App by restart of container: YES
Required Internet connection during container starts: YES
Code: Bash
Based on image: alpine
Based on Apache Web Server: YES
Image approx. size(compressed): 9 MB
Architecture available: amd64, arm32, arm64
Stand-alone version with Web App included: NO
Update of Web App by restart of container: YES
Required Internet connection during container starts: YES
Comments
That's a very useful guide for people who want to have Web App working on the closed network without access to the internet. Still, I think it's important to add, that if you just want to make your own... [Read more]
I completely agree. The premise of creating this image was to have devices based on OpenBeken firmware completely offline. OpenBeken frees us from the Tuya cloud, and a locally hosted container ultimately... [Read more]
It should be fully possible to host that web app on the OBK device itself, but it would make updates problematic. Futhermore, I haven't tested the size of web app files in a long time, so they might have... [Read more]
I see which means this leads us to a small walkaround: Image: closed0beta/openbeken_webapp_http-server Contains all necessary files and depends on my updates Command to run: docker run -p... [Read more]
@taktlos It looks like this could be run on linux/amd only. Probably is good idea to be able to run on linux/arm also... [Read more]
Great suggestion! I've created an extra image for arm64, expanding platform support to two options: amd64 and arm64. [EDIT] Additional image for arm32 aka arm v7 due to Alpine version 3.15 Command... [Read more]
@taktlos As far as I know, Alpine 3.15 was outdated - I think at some point in November last year (2023). Nevertheless, the web page is not so complicated to require more. Works perfect, so everything... [Read more]
Ok then. ARMv6 and ARMv7 build(32-bit) based on: Alpine Linux version: 3.19.0 Nodejs version: v12.22.9 Node version: v21.4.0 Npm version: 10.2.5 Command to run: docker run -p 7231:80... [Read more]
@taktlos Something wrong with port publishing in the last version. https://obrazki.elektroda.pl/1913623100_1704648523_thumb.jpg without restart=always container stops after few seconds. With... [Read more]
All right, so the earlier obsolete version of Alpine Linux back in business. Alpine Linux version: 3.15 Nodejs version: 16.20.2-r0 Npm version: 8.1.3-r0 [Read more]
https://obrazki.elektroda.pl/5066074700_1704655680_thumb.jpg Yep. With outdated Alpine - everything is ok. I think the problem is with my docker - v 20.10.15 for wdmycoudex4100 dated May 2022....... [Read more]
Hi, Finally I am getting at incorporating the Webapp in a private network with no internet access. To go one step further, I want to know whether the "Logs" option can be implemented via the device... [Read more]
Hi, You have to ask person responsible for a web app development. Ie. github? This topic is about containeerized version only. [Read more]
I tried creating the files in LittleFS. https://obrazki.elektroda.pl/7881742300_1705998279_thumb.jpg I edited the paths so that everything gets referenced from / (no sub directories). As... [Read more]
@jkwim You most probably would like to check LittleFS size rather than firmware flash size. In web app -> logs run command lfs_size it will return size in bytes (hex). By me this returns 0x8000, which... [Read more]
@jkwim please open another topic and we can look into that together, but long story short, LittleFS could have even 500kB or so, but it would need to be shifted to the OTA space, and then OTA would wipe... [Read more]
Opened a new topic as suggested: Hosting OpenBekenIOT Web App's 'Logs' function in the LittleFS of the Device (BK7231T) [Read more]
Different flavours of images available: closed0beta/openbeken_webapp_http-server:latest Based on image: node:18-alpine Based on npm http-server: YES Image approx. size(compressed): 73 MB Architecture... [Read more]
Well, that's a good work. Thank you. [Read more]