docs(wss): more ws stuff
This commit is contained in:
@@ -1,10 +1,11 @@
|
||||
import { useState } from 'react'
|
||||
import reactLogo from './assets/react.svg'
|
||||
import viteLogo from '/vite.svg'
|
||||
import './App.css'
|
||||
import { useState } from "react";
|
||||
import reactLogo from "./assets/react.svg";
|
||||
import viteLogo from "/vite.svg";
|
||||
import "./App.css";
|
||||
import WebSocketViewer from "./WebSocketTest";
|
||||
|
||||
function App() {
|
||||
const [count, setCount] = useState(0)
|
||||
const [count, setCount] = useState(0);
|
||||
|
||||
return (
|
||||
<>
|
||||
@@ -13,7 +14,11 @@ function App() {
|
||||
<img src={viteLogo} className="logo" alt="Vite logo" />
|
||||
</a>
|
||||
<a href="https://react.dev" target="_blank">
|
||||
<img src={reactLogo} className="logo react" alt="React logo" />
|
||||
<img
|
||||
src={reactLogo}
|
||||
className="logo react"
|
||||
alt="React logo"
|
||||
/>
|
||||
</a>
|
||||
</div>
|
||||
<h1>Vite + React</h1>
|
||||
@@ -28,8 +33,9 @@ function App() {
|
||||
<p className="read-the-docs">
|
||||
Click on the Vite and React logos to learn more
|
||||
</p>
|
||||
<WebSocketViewer />
|
||||
</>
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
export default App
|
||||
export default App;
|
||||
|
||||
41
frontend/src/WebSocketTest.tsx
Normal file
41
frontend/src/WebSocketTest.tsx
Normal file
@@ -0,0 +1,41 @@
|
||||
import { useEffect, useRef } from "react";
|
||||
|
||||
const WebSocketViewer = () => {
|
||||
const ws = useRef<any>(null);
|
||||
|
||||
useEffect(() => {
|
||||
// Connect to your Go backend WebSocket endpoint
|
||||
ws.current = new WebSocket(
|
||||
(window.location.protocol === "https:" ? "wss://" : "ws://") +
|
||||
window.location.host +
|
||||
"/lst/api/logger/logs"
|
||||
);
|
||||
|
||||
ws.current.onopen = () => {
|
||||
console.log("[WebSocket] Connected");
|
||||
};
|
||||
|
||||
ws.current.onmessage = (event: any) => {
|
||||
console.log("[WebSocket] Message received:", event.data);
|
||||
};
|
||||
|
||||
ws.current.onerror = (error: any) => {
|
||||
console.error("[WebSocket] Error:", error);
|
||||
};
|
||||
|
||||
ws.current.onclose = () => {
|
||||
console.log("[WebSocket] Disconnected");
|
||||
};
|
||||
|
||||
// Cleanup on unmount
|
||||
return () => {
|
||||
if (ws.current) {
|
||||
ws.current.close();
|
||||
}
|
||||
};
|
||||
}, []);
|
||||
|
||||
return <div>Check the console for WebSocket messages</div>;
|
||||
};
|
||||
|
||||
export default WebSocketViewer;
|
||||
Reference in New Issue
Block a user