>_ DevTrendsde

Sprache

Start

Sprachen

Bereiche

Frontend Backend Mobile DevOps AI / ML GameDev Blockchain Embedded Sicherheit
Java

So verwandeln Sie Ihren Fernseher in eine Web-Plattform mit WebHomeTV

Jeder, der versucht hat, ein Media Center auf Android TV oder einer TV-Box einzurichten, ist wahrscheinlich auf das TVBox- und FongMi-Ökosystem gestoßen. Dies sind beliebte Open-Source-Player, die Inhalte über Python- und JavaScript-Skripte laden können. Sie haben ein Problem: Die Startbildschirm-Oberfläche ist eng mit dem Standard-App-Grid-Layout verknüpft. Das Layout zu ändern oder einen benutzerdefinierten Empfehlungs-Feed einzubetten, ohne die gesamte APK neu zu erstellen, ist einfach nicht möglich.

Der Entwickler fish2018 hat einen anderen Ansatz gewählt und das Repository webhtv (WebHomeTV) erstellt. Das Projekt basiert auf der Codebasis von FongMi, ändert aber das grundlegende Konzept des Startbildschirms. Jetzt ist der Startbildschirm eine vollwertige Webseite, die mit HTML, CSS und JS erstellt wurde und über eine eingebaute JS-Bridge und die nativen APIs der App mit Android kommuniziert.

Was steckt dahinter und wie es funktioniert

Im Wesentlichen ist dies eine hybride Android-App für Smartphones und TVs. Im Inneren arbeiten zwei Schichten zusammen. Auf der einen Seite bleiben die vertrauten Content-Parser (Spider/CSP), während auf der anderen ein Chromium-Kontext und ein lokaler Webserver gestartet werden, um benutzerdefinierte Layouts zu rendern.

Sie können ein beliebiges Frontend erstellen, es auf Ihrem eigenen Server oder dem Speicher der Box ablegen und von dort aus die Suche steuern, den Videoplayer aufrufen, die Link-Verfügbarkeit prüfen und den Wiedergabeverlauf synchronisieren.

Was dieses Projekt interessant macht

Die Entwickler haben ein natives SDK für den Browser-Kontext entwickelt. Wenn das Frontend in der WebView der App geladen wird, erhält es Zugriff auf ein Objekt mit Methoden zur Interaktion mit Hardware und dem Betriebssystem. Die Webseite kann unabhängig domänenübergreifende Netzwerkanfragen senden, die CORS-Regeln umgehen, den Wiedergabeverlauf anfordern, den System-Proxy verwenden und Videostreams direkt an den internen Videoplayer übergeben. Wenn Ihnen das Standard-Kategorie-Grid langweilig wird, können Sie ein Frontend im Stil eines filmischen interaktiven Dashboards oder als textbasiertes Terminal erstellen.

Besondere Aufmerksamkeit verdient das integrierte Link-Prüfsystem für Cloud-Speicher und die intelligente Ranking-Engine für Quellen. Die App prüft die Gültigkeit von freigegebenen Ordnern auf beliebten File-Sharing-Diensten direkt out of the box. Gleichzeitig verfolgt das System die Erfolgsquote von Suchen und Wiedergabe für jede verbundene Website. Im Laufe der Zeit steigen die schnellsten und stabilsten Quellen automatisch in der Ergebnisliste auf.

Die Steuerung all dessen mit einer Fernbedienung ist nicht immer praktisch, daher ist ein Admin-Panel in die App eingebaut. Wenn Sie WebHomeTV auf Ihrem Fernseher ausführen und die Adresse /m in einem Browser auf Ihrem Computer oder Smartphone öffnen, öffnet sich ein Web-Kontrollpanel. Darüber können Sie bequem Quellen konfigurieren, Autorisierungs-Token übergeben, benutzerdefinierte Erweiterungsskripte hochladen und Videoplayer-Logs anzeigen.

Wenn Sie mehrere TV-Boxen und Telefone zu Hause haben, müssen Sie die Konfiguration nicht manuell auf jedem Gerät anpassen. Eine lokale Netzwerksynchronisierung ist implementiert: Einstellungen, Wiedergabeverlauf, Autorisierungs-Cookies und Lesezeichen werden zwischen Clients mit wenigen Klicks übertragen. Für Remote-Geräte können Sie einen Zwischen-Relay in Go, Rust, Cloudflare Workers oder Vercel einrichten.

Architektur und native Bibliotheken

Der technische Inhalt des Repositories sieht ernstzunehmend aus. Dies ist weit von einer einfachen Fassade über den systemeigenen Android MediaPlayer entfernt.

Die App ist mit Java 21 und Android SDK 37 (compileSdk 37, minSdk 24) erstellt. Der Code unterstützt zwei Flavors: mobile für Touchscreens und leanback für die Fernbedienungssteuerung.

Der interessanteste Teil verbirgt sich in der Player-Engine. Die Autoren haben sich nicht auf den Standard-ExoPlayer beschränkt und einen tiefgreifend angepassten MPV auf C/C++-Basis eingebettet. Im Inneren verwendet er aktuelle Builds von FFmpeg (n8.0.3), libplacebo und curl mit HTTP/2-Unterstützung. Für die Videoausgabe auf Android 15 haben sie eine Kombination aus Vulkan und MediaCodec über AImageReader und Android Hardware Buffer verwendet, was es ermöglicht, den Videostream direkt im GPU-Speicher zu dekodieren, ohne unnötige Frame-Kopien.

Zusätzlich zu MPV enthält das Projekt einen Fork von Media3 (Version 1.11.0-alpha01-fongmi) mit benutzerdefinierten Patches. Ein Patch fügt beispielsweise einen hochperformanten WebSocket-Handler für Online-Kommentare und Untertitel mit Queue-Unterstützung und Framerate-Limits hinzu.

Aus dem Quellcode bauen

Wenn Sie das Projekt selbst bauen möchten, benötigen Sie ein vorbereitetes Android SDK mit NDK 28.2.13676358 und JDK 21. Das Repository enthält bereits vorkompilierte .so-Bibliotheken, sodass Sie beim ersten Build MPV und FFmpeg nicht von Grund auf neu erstellen müssen.

Der Build-Prozess über die Konsole sieht Standard aus:

git clone https://github.com/fish2018/webhtv.git
cd webhtv
echo "sdk.dir=$ANDROID_HOME" > local.properties
bash gradlew :app:assembleMobileArm64_v8aDebug :app:assembleLeanbackArm64_v8aDebug

Fertige APK-Dateien werden in Verzeichnissen in app/build/outputs/apk/ abgelegt. Das Repository enthält auch Skripte im scripts/-Ordner, die die ELF-Header-Integrität prüfen und bei Bedarf JNI-Bridges neu erstellen.

Developer Kit und KI-Tools

Im webhome-devkit-Ordner haben die Autoren ein vollständiges Toolkit zum Erstellen eigener Startbildschirme geteilt. Es gibt fertige Layout-Vorlagen, Beispiele für Erweiterungen zum Injizieren von JS-Code in Webseiten und Dokumentation für die Arbeit mit dem SDK.

Ein interessantes Detail: Die Entwickler haben einen Satz fertiger Regeln (Skills) für KI-Assistenten hinzugefügt. Sie können diese mit Cursor, Claude oder anderen neuronalen Netzwerk-Editoren verbinden, um neue Module und Parser für WebHomeTV automatisch durch Prompts zu generieren.

Für wen ist dieses Projekt nützlich

Wenn Sie Hobbyprojekte für Android TV schreiben oder einen benutzerdefinierten Media-Hub für den Heimgebrauch erstellen möchten, bietet WebHomeTV eine leistungsstarke, fertige Grundlage. Sie müssen keine Decoder, Netzwerkanfrage-Manager und Fernbedienungs-Ereignisbehandlung von Grund auf schreiben. Bauen Sie einfach eine übersichtliche Webseite und binden Sie sie an das native SDK.

Das Projekt ist spezifisch, aber extrem durchdacht. Es löst das langjährige Problem monolithischer TV-Player und gibt Webentwicklern vollständige Freiheit bei der Erstellung von Oberflächen für große Bildschirme.

Ähnliche Projekte