- Implement API service modules for sensors, rooms, analytics, health, and auth - Add Pinia auth store for JWT token management and validation - Create Vue composables for API integration and state management - Update settings and AI optimization views for code style and connection URLs - Add test-websocket.html for local WebSocket testing
121 lines
4.2 KiB
HTML
121 lines
4.2 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>WebSocket Test</title>
|
|
</head>
|
|
<body>
|
|
<h1>WebSocket Connection Test</h1>
|
|
<div id="status">Disconnected</div>
|
|
<div id="messages"></div>
|
|
<button onclick="connect()">Connect</button>
|
|
<button onclick="disconnect()">Disconnect</button>
|
|
|
|
<script>
|
|
let socket = null;
|
|
let isConnected = false;
|
|
|
|
function updateStatus(status) {
|
|
document.getElementById('status').textContent = status;
|
|
}
|
|
|
|
function addMessage(message) {
|
|
const div = document.createElement('div');
|
|
div.textContent = new Date().toLocaleTimeString() + ': ' + message;
|
|
document.getElementById('messages').appendChild(div);
|
|
}
|
|
|
|
function connect() {
|
|
if (isConnected) {
|
|
addMessage('Already connected');
|
|
return;
|
|
}
|
|
|
|
// Close any existing connection
|
|
if (socket) {
|
|
socket.close();
|
|
socket = null;
|
|
}
|
|
|
|
addMessage('Connecting to ws://localhost:8000/ws...');
|
|
socket = new WebSocket('ws://localhost:8000/ws');
|
|
|
|
socket.onopen = () => {
|
|
addMessage('Connected to API Gateway');
|
|
updateStatus('Connected');
|
|
isConnected = true;
|
|
};
|
|
|
|
socket.onmessage = (event) => {
|
|
try {
|
|
const data = JSON.parse(event.data);
|
|
addMessage('Received: ' + JSON.stringify(data));
|
|
|
|
// Handle proxy info
|
|
if (data.type === 'proxy_info') {
|
|
addMessage('Received proxy info, reconnecting to sensor service...');
|
|
socket.close();
|
|
|
|
setTimeout(() => {
|
|
addMessage('Connecting to ws://localhost:8007/ws...');
|
|
socket = new WebSocket('ws://localhost:8007/ws');
|
|
|
|
socket.onopen = () => {
|
|
addMessage('Connected to sensor service');
|
|
updateStatus('Connected to Sensor Service');
|
|
isConnected = true;
|
|
};
|
|
|
|
socket.onmessage = (event) => {
|
|
try {
|
|
const data = JSON.parse(event.data);
|
|
if (data.type !== 'connection_established') {
|
|
addMessage('Data: ' + JSON.stringify(data));
|
|
}
|
|
} catch (e) {
|
|
addMessage('Raw: ' + event.data);
|
|
}
|
|
};
|
|
|
|
socket.onclose = (event) => {
|
|
addMessage(`Sensor service connection closed. Code: ${event.code}`);
|
|
updateStatus('Disconnected');
|
|
isConnected = false;
|
|
};
|
|
|
|
socket.onerror = (error) => {
|
|
addMessage('Sensor service error: ' + error);
|
|
updateStatus('Error');
|
|
isConnected = false;
|
|
};
|
|
}, 100);
|
|
}
|
|
} catch (e) {
|
|
addMessage('Raw: ' + event.data);
|
|
}
|
|
};
|
|
|
|
socket.onclose = (event) => {
|
|
addMessage(`API Gateway connection closed. Code: ${event.code}`);
|
|
updateStatus('Disconnected');
|
|
isConnected = false;
|
|
};
|
|
|
|
socket.onerror = (error) => {
|
|
addMessage('API Gateway error: ' + error);
|
|
updateStatus('Error');
|
|
isConnected = false;
|
|
};
|
|
}
|
|
|
|
function disconnect() {
|
|
if (socket) {
|
|
socket.close();
|
|
socket = null;
|
|
isConnected = false;
|
|
updateStatus('Disconnected');
|
|
addMessage('Disconnected manually');
|
|
}
|
|
}
|
|
</script>
|
|
</body>
|
|
</html> |