Hi,
I have OBS v29.1.3 installed. It already has websockets inbuilt, which I have configured. I also have a profile ready and working for recording.
I am not good at websocket programming, but I would like my webpage to have a button, that will record via the profile setup on my PC.
Assume Local Host at 192.168.1.10:4455 and password as 'XXX'
Can someone point me to the place where i can understand how to do this. Possibly a sample HTML/Javascript sample/example implementing this.
I got ChatGPT to give me something, as below, it just wont work, and it cant do any more :-(
Thanks in advance, The Code I am trying and wont work, Follows:
<!DOCTYPE html>
<html>
<head>
<title>OBS Recording Button</title>
</head>
<body>
<button id="recordButton">Start Recording</button>
<script>
// Create a new WebSocket connection to OBS with the server password
const obsSocket = new WebSocket('ws://192.168.1.10:4455', 'XXX');
// When the connection is established
obsSocket.onopen = () => {
console.log('Connected to OBS WebSocket');
// Retrieve the record button element
const recordButton = document.getElementById('recordButton');
// Add click event listener to the record button
recordButton.addEventListener('click', () => {
// Send the command to start recording using the "RTR" profile
obsSocket.send(JSON.stringify({
"request-type": "StartRecording",
"message-id": "start-recording",
"profile": "RTR"
}));
console.log('Recording started');
});
};
// When a message is received from OBS
obsSocket.onmessage = (event) => {
const message = JSON.parse(event.data);
console.log('Received message from OBS:', message);
};
// When an error occurs
obsSocket.onerror = (error) => {
console.error('OBS WebSocket error:', error);
};
// When the connection is closed
obsSocket.onclose = () => {
console.log('Disconnected from OBS WebSocket');
};
</script>
</body>
</html>
I have OBS v29.1.3 installed. It already has websockets inbuilt, which I have configured. I also have a profile ready and working for recording.
I am not good at websocket programming, but I would like my webpage to have a button, that will record via the profile setup on my PC.
Assume Local Host at 192.168.1.10:4455 and password as 'XXX'
Can someone point me to the place where i can understand how to do this. Possibly a sample HTML/Javascript sample/example implementing this.
I got ChatGPT to give me something, as below, it just wont work, and it cant do any more :-(
Thanks in advance, The Code I am trying and wont work, Follows:
<!DOCTYPE html>
<html>
<head>
<title>OBS Recording Button</title>
</head>
<body>
<button id="recordButton">Start Recording</button>
<script>
// Create a new WebSocket connection to OBS with the server password
const obsSocket = new WebSocket('ws://192.168.1.10:4455', 'XXX');
// When the connection is established
obsSocket.onopen = () => {
console.log('Connected to OBS WebSocket');
// Retrieve the record button element
const recordButton = document.getElementById('recordButton');
// Add click event listener to the record button
recordButton.addEventListener('click', () => {
// Send the command to start recording using the "RTR" profile
obsSocket.send(JSON.stringify({
"request-type": "StartRecording",
"message-id": "start-recording",
"profile": "RTR"
}));
console.log('Recording started');
});
};
// When a message is received from OBS
obsSocket.onmessage = (event) => {
const message = JSON.parse(event.data);
console.log('Received message from OBS:', message);
};
// When an error occurs
obsSocket.onerror = (error) => {
console.error('OBS WebSocket error:', error);
};
// When the connection is closed
obsSocket.onclose = () => {
console.log('Disconnected from OBS WebSocket');
};
</script>
</body>
</html>
