Backend-Entwicklung
Golang
Erstellen eines einfachen Echtzeit-Systemmonitors mit Go, HTMX und Web Socket
Erstellen eines einfachen Echtzeit-Systemmonitors mit Go, HTMX und Web Socket
Nov 21, 2024 am 11:37 AM
Ich habe ein lustiges Projekt für die Arbeit mit Go, HTMX und Tailwwindcss gefunden und am Ende einen einfachen webbasierten Echtzeit-Systemmonitor mit der Leistung von Web Socket erstellt. Hier ist das Ergebnis.
Es zeigt Systeminformationen, Speicher, Festplatte, CPU und laufende Prozesse an, die alle 5 Sekunden automatisch aktualisiert werden.
Ich werde den Code in diesem Beitrag etwas aufschlüsseln.
Stapel
- Gehen Sie zu 1.23.2
- Htmx
- Tailwindcss
- Gopsutil
- Websocket
- Htmx-Websocket-Erweiterung
HTTP-Server
type HttpServer struct {
subscriberMessageBuffer int
Mux http.ServeMux
subscribersMutex sync.Mutex
subscribers map[*subscriber]struct{}
}
type subscriber struct {
msgs chan []byte
}
Es ist ganz einfach. HttpServer enth?lt einen http.ServeMux als http-Handler und Abonnenten für sp?teres Web-Socket-Broadcasting. Der Abonnent hat einfach einen Nachrichtenkanal für die Datenaktualisierung.
Da nur eine einzige HTML-Datei bereitgestellt werden muss, ben?tigt es eine URL zum Anzeigen der Seite und eine URL für die Web-Socket-Verbindung.
func NewHttpServer() *HttpServer {
s := &HttpServer{
subscriberMessageBuffer: 10,
subscribers: make(map[*subscriber]struct{}),
}
s.Mux.Handle("/", http.FileServer(http.Dir("./views")))
s.Mux.HandleFunc("/ws", s.subscribeHandler)
return s
}
Web-Socket-Verbindung und -Abonnent
Endpunkt /ws kümmert sich um die Web-Socket-Verbindung und verwaltet einen Abonnenten. Zun?chst wird ein neuer Abonnent initiiert und zu einer Karte in der http-Serverstruktur hinzugefügt. Die Sperre wird verwendet, um eine Rennbedingung zu verhindern, da wir sp?ter die Go-Routine verwenden werden.
func (s *HttpServer) subscribeHandler(w http.ResponseWriter, r *http.Request) {
err := s.subscribe(r.Context(), w, r)
if err != nil {
fmt.Println(err)
return
}
}
func (s *HttpServer) addSubscriber(subscriber *subscriber) {
s.subscribersMutex.Lock()
s.subscribers[subscriber] = struct{}{}
s.subscribersMutex.Unlock()
fmt.Println("subscriber added", subscriber)
}
Web Socket beginnt, eine Verbindung zu akzeptieren und über eine Schleife erkennen wir eingehende Kanalnachrichten vom Abonnenten und schreiben sie an Web Socket.
func (s *HttpServer) subscribe(ctx context.Context, w http.ResponseWriter, r *http.Request) error {
var c *websocket.Conn
subscriber := &subscriber{
msgs: make(chan []byte, s.subscriberMessageBuffer),
}
s.addSubscriber(subscriber)
c, err := websocket.Accept(w, r, nil)
if err != nil {
return err
}
defer c.CloseNow()
ctx = c.CloseRead(ctx)
for {
select {
case msg := <-subscriber.msgs:
ctx, cancel := context.WithTimeout(ctx, time.Second)
defer cancel()
err := c.Write(ctx, websocket.MessageText, msg)
if err != nil {
return err
}
case <-ctx.Done():
return ctx.Err()
}
}
}
Automatische Aktualisierung
Die automatische Aktualisierung der Systeminformationsdaten erfolgt durch die Go-Routine. Wir erstellen eine HTML-Antwort, die über einen Web-Socket gesendet wird, und htmx übernimmt die Aktualisierung auf der HTML-Seite.
func main() {
fmt.Println("Starting system monitor")
s := server.NewHttpServer()
go func(s *server.HttpServer) {
for {
hostStat, _ := host.Info()
timestamp := time.Now().Format("2006-01-02 15:04:05")
html := `
<span hx-swap-oob="innerHTML:#data-timestamp">` + timestamp + `</span>
<span hx-swap-oob="innerHTML:#system-hostname">` + hostStat.Hostname + `</span>
<span hx-swap-oob="innerHTML:#system-os">` + hostStat.OS + `</span>
`
s.Broadcast([]byte(html))
time.Sleep(time.Second * 5)
}
}(s)
// ...
}
Die Syntax hx-swap-oob="innerHTML:#data-timestamp" in HTML besagt, dass wir eine Komponente innerhalb der Daten-Zeitstempel-ID in unserem HTML austauschen sollen. Alle Austauschmechanismen sind für andere Systeminformationskomponenten gleich.
Alle austauschbaren HTML-Komponenten werden über die Broadcast-Methode (msg) und sp?ter alle 5 Sekunden über den Kanal gesendet.
func (s *HttpServer) Broadcast(msg []byte) {
s.subscribersMutex.Lock()
for subscriber := range s.subscribers {
subscriber.msgs <- msg
}
s.subscribersMutex.Unlock()
}
Die HTMX-Ansicht
Es ist eine einfache HTML-Datei und für Tailwindcss habe ich dafür einfach CDN verwendet
<script src="https://cdn.tailwindcss.com"></script>
Gleiche Idee für HTMX und Web-Socket-Erweiterung für die Verwendung von CDN.
<script src="https://unpkg.com/htmx.org@2.0.3" integrity="sha384-0895/pl2MU10Hqc6jd4RvrthNlDiE9U1tWmX7WRESftEDRosgxNsQG/Ze9YMRzHq" crossorigin="anonymous"></script> <script src="https://unpkg.com/htmx-ext-ws@2.0.1/ws.js"></script>
Wie verbinde ich mich mit dem Web-Socket?
Es wird erwartet, dass die Systemüberwachungsseite alle Daten per Web-Socket empf?ngt, sodass ich sie vom Haupt-Div-Container aus festlegen kann. Geben Sie hx-ext=“ws“ an, um HTMX anzuweisen, die Web-Socket-Erweiterung zu verwenden, und ws-connect=“/ws“, um Web-Socket anzuweisen, eine Verbindung über die /ws-URL herzustellen.
<body>
<h2>
Vollst?ndiger Code
</h2>
<p>Hier ist die Vollversion des Codes https://github.com/didikz/gosysmon-web und vielleicht m?chten Sie mit Ihrer eigenen Version herumspielen.</p>
<p>Viel Spa? beim Codieren!</p>
Das obige ist der detaillierte Inhalt vonErstellen eines einfachen Echtzeit-Systemmonitors mit Go, HTMX und Web Socket. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
Hei?e KI -Werkzeuge
Undress AI Tool
Ausziehbilder kostenlos
Undresser.AI Undress
KI-gestützte App zum Erstellen realistischer Aktfotos
AI Clothes Remover
Online-KI-Tool zum Entfernen von Kleidung aus Fotos.
Clothoff.io
KI-Kleiderentferner
Video Face Swap
Tauschen Sie Gesichter in jedem Video mühelos mit unserem v?llig kostenlosen KI-Gesichtstausch-Tool aus!
Hei?er Artikel
Hei?e Werkzeuge
Notepad++7.3.1
Einfach zu bedienender und kostenloser Code-Editor
SublimeText3 chinesische Version
Chinesische Version, sehr einfach zu bedienen
Senden Sie Studio 13.0.1
Leistungsstarke integrierte PHP-Entwicklungsumgebung
Dreamweaver CS6
Visuelle Webentwicklungstools
SublimeText3 Mac-Version
Codebearbeitungssoftware auf Gottesniveau (SublimeText3)
Hei?e Themen
Was sind die Auswirkungen der statischen Verknüpfung von Go standardm??ig?
Jun 19, 2025 am 01:08 AM
GO kompiliert das Programm standardm??ig in eine eigenst?ndige Bin?rdatei. Der Hauptgrund ist die statische Verknüpfung. 1. Einfacher Bereitstellung: Keine zus?tzliche Installation von Abh?ngigkeitsbibliotheken kann direkt über Linux -Verteilungen ausgeführt werden. 2. Gr??ere bin?re Gr??e: einschlie?lich aller Abh?ngigkeiten führt zu einer Erh?hung der Dateigr??e, kann jedoch durch Erstellen von Flags oder Komprimierungswerkzeugen optimiert werden. 3.. H?here Vorhersagbarkeit und Sicherheit: Vermeiden Sie Risiken, die durch ?nderungen der externen Bibliotheksversionen verursacht werden und die Stabilit?t verbessern; 4. Flexibilit?t begrenzter Betrieb: Kann nicht hei?es Update der gemeinsam genutzten Bibliotheken sowie eine Neukompilien und Bereitstellung erforderlich sind, um Abh?ngigkeitsf?lligkeiten zu beheben. Diese Funktionen sind für CLI-Tools, Microservices und andere Szenarien geeignet. In Umgebungen, in denen die Speicherung eingeschr?nkt ist oder auf zentrales Management beruht, sind Kompromisse erforderlich.
Wie erstelle ich einen gepufferten Kanal in Go? (z. B. machen (Chan int, 10))
Jun 20, 2025 am 01:07 AM
Um einen Pufferkanal in GO zu erstellen, geben Sie einfach die Kapazit?tsparameter in der Funktion machen. Mit dem Pufferkanal kann der Sendungsvorgang Daten vorübergehend speichern, wenn kein Empf?nger vorliegt, solange die angegebene Kapazit?t nicht überschritten wird. Zum Beispiel erstellt CH: = make (Chanint, 10) einen Pufferkanal, der bis zu 10 Ganzzahlwerte speichern kann. Im Gegensatz zu ungelandten Kan?len werden die Daten beim Senden nicht sofort blockiert, aber die Daten werden vorübergehend im Puffer gespeichert, bis sie vom Empf?nger weggenommen werden. Beachten Sie bitte: 1. Die Kapazit?tseinstellung sollte angemessen sein, um Speicherabf?lle oder h?ufiges Blockieren zu vermeiden. 2. Der Puffer muss verhindern, dass Speicherprobleme im Puffer auf unbestimmte Zeit angesammelt werden. 3. Das Signal kann vom Chanstruct {} -Typ übergeben werden, um Ressourcen zu sparen; Zu den h?ufigen Szenarien geh?rt die Kontrolle der Anzahl der Parallelit?t, Herstellerverbrauchermodelle und Differenzierung
Wie sorgt Gehen, die Speichersicherheit ohne manuelle Speicherverwaltung wie in C gew?hrleistet?
Jun 19, 2025 am 01:11 AM
GOENSURSMEMORYSFETTYWITHOUTMANUALMANUMAGETROUGHAUTOMATICGARBAGECOLLECTION, Nopointerarithmetic, SafeConcurrency, Andruntimechecks.First, Go’sgarbageboceColectorAutomaticReclaimsUnusedMemory, Verhinderung von Verhinderung der Verhinderung von Verhinderung der
Wie k?nnen Sie GO für Systemprogrammieraufgaben verwenden?
Jun 19, 2025 am 01:10 AM
GO ist ideal für die Systemprogrammierung, da es die Leistung von kompilierten Sprachen wie C mit der Benutzerfreundlichkeit und Sicherheit moderner Sprachen kombiniert. 1. In Bezug auf Datei- und Verzeichnisoperationen unterstützt das Betriebssystempaket von Go unterstützt die Erstellung, L?schung, Umbenennung und überprüfung, ob Dateien und Verzeichnisse vorhanden sind. Verwenden Sie OS.ReadFile, um die gesamte Datei in einer Codezeile zu lesen, die zum Schreiben von Sicherungsskripten oder Protokollierungstools geeignet ist. 2. In Bezug auf die Prozessverwaltung kann die Funktion von Exec.Command des OS/EXEC -Pakets externe Befehle ausführen, die Ausgabe erfassen, Umgebungsvariablen festlegen, Eingangs- und Ausgangsflüsse umleiten und die Lebensdauer von Prozesslebenszyklen für Automatisierungstools und Bereitstellungsskripte geeignet sind. 3. In Bezug auf Netzwerk und Parallelit?t unterstützt das NET -Paket TCP/UDP -Programmierung, DNS -Abfrage und Originals?tze.
Wie nenne ich eine Methode auf einer Strukturinstanz in Go?
Jun 24, 2025 pm 03:17 PM
In der GO -Sprache muss eine Strukturmethode aufgerufen werden, muss zun?chst die Struktur und die Methode definieren, die den Empf?nger bindet, und auf sie zugreift mit einer Punktzahl. Nach der Definition des Strukturrechtecks ??kann die Methode über den Wertempf?nger oder den Zeigerempf?nger deklariert werden. 1. Verwenden Sie den Wertempf?nger wie Func (rrectangle) aa () int und rufen Sie ihn direkt über rect.Area () an; 2. Wenn Sie die Struktur ?ndern müssen, verwenden Sie den Zeigerempf?nger wie Func (R*Rechteck) Setwidth (...) und behandelt automatisch die Umwandlung von Zeigern und Werten. 3. Bei der Einbettung der Struktur wird die Methode der eingebetteten Struktur verbessert und kann direkt durch die ?u?ere Struktur aufgerufen werden. 4..
Was sind Schnittstellen in Go und wie definiere ich sie?
Jun 22, 2025 pm 03:41 PM
In Go ist eine Schnittstelle ein Typ, der Verhalten ohne Angabe der Implementierung definiert. Eine Schnittstelle besteht aus Methodensignaturen und jedem Typ, der diese Methoden implementiert, die die Schnittstelle automatisch erfüllt. Wenn Sie beispielsweise eine Lautsprecherschnittstelle definieren, die die Speak () -Methode enth?lt, k?nnen alle Typen, die die Methode implementieren, als Sprecher betrachtet werden. Schnittstellen eignen sich zum Schreiben gemeinsamer Funktionen, Abstrakt -Implementierungsdetails und Verwendung von Scheinobjekten im Testen. Das Definieren einer Schnittstelle verwendet das Schlüsselwort der Schnittstelle und listet Methodensignaturen auf, ohne den Typ ausdrücklich zu deklarieren, um die Schnittstelle zu implementieren. Gemeinsame Anwendungsf?lle umfassen Protokolle, Formatierung, Abstraktionen verschiedener Datenbanken oder Dienste sowie Benachrichtigungssysteme. Zum Beispiel k?nnen sowohl Hund- als auch Robotertypen Sprechmethoden implementieren und an dieselbe Anno weitergeben
Wie verwende ich String -Funktionen aus dem Strings -Paket in Go? (z. B. Len (), Strings.Contains (), Strings.Index (), Strings.Replaceall ()))
Jun 20, 2025 am 01:06 AM
In der GO-Sprache werden String-Operationen haupts?chlich über Strings-Pakete und integrierte Funktionen implementiert. 1.Strings.Contains () wird verwendet, um festzustellen, ob eine Zeichenfolge einen Substring enth?lt, und gibt einen booleschen Wert zurück. 2.Strings.index () kann den Ort finden, an dem das Substring zum ersten Mal erscheint und wenn es nicht existiert, gibt es -1 zurück. 3.Strings.ReplaceAll () kann alle übereinstimmenden Substrings ersetzen und auch die Anzahl der Ersetzungen durch Zeichenfolgen steuern. Replace (); 4.Len () Funktion wird verwendet, um die L?nge der Bytes der Zeichenfolge zu erhalten. Bei der Verarbeitung von Unicode müssen Sie jedoch auf den Unterschied zwischen Zeichen und Bytes achten. Diese Funktionen werden h?ufig in Szenarien wie Datenfilterung, Textanalyse und String -Verarbeitung verwendet.
Wie benutze ich das IO -Paket, um mit Eingabe- und Ausgabestr?men in Go zu arbeiten?
Jun 20, 2025 am 11:25 AM
TheGoiopackageProviDEnterFaCesLikeraderAndWritertOhandlei/ooperationsgerafigAcrossSources.1.io.
