I want to simulate a spacebar click on the web. I have a react native app where when i press a button it sends a post request to the server. There i want every time a request comes(the button is pressed) a spacebar click to be simulated on the web. Here is my server code
const express = require('express');
const app = express();
const http = require('http').Server(app);
const io = require('socket.io')(http); // Import and initialize Socket.IO
const path = require('path');
const simulateBoost = require('./boost-simulation');
const PORT = process.env.PORT || 8080;
app.use(express.urlencoded());
app.use(express.json());
// Serve static files from the 'public' directory
app.use(express.static(path.join(__dirname, 'public')));
// Serve static files from the 'build' directory (Unity WebGL)
app.use(express.static(path.join(__dirname, 'build')));
// Route handler for the root URL ("/")
app.get('/', (req, res) => {
res.sendFile(path.join(__dirname, 'public', 'index.html'));
});
app.post('/', (req, res) => {
// Handle the POST request data
const postData = req.body.data;
// Process the data as needed
console.log('Received POST data:', postData);
// Send a response
res.json({ message: 'Data received successfully' });
if(postData === 'boost') {
// Sending a message to the frontend to trigger space key press
io.emit('boost'); // Emitting 'boost' event to all connected clients
}
});
// Socket.IO connection handler
io.on('connection', (socket) => {
console.log('A user connected');
socket.on('disconnect', () => {
console.log('User disconnected');
});
});
// Start the server
http.listen(PORT, () => {
console.log(`Server is running on port ${PORT}`);
});
and here is my script in the html
<!DOCTYPE html>
<html lang="en-us">
<head>
<meta charset="utf-8">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Unity WebGL Player | Cannon_Game#1</title>
<link rel="shortcut icon" href="TemplateData/favicon.ico">
<link rel="stylesheet" href="TemplateData/style.css">
<script src="game.js" type="module"></script>
</head>
<body>
<div id="unity-container" class="unity-desktop">
<canvas id="unity-canvas" width=960 height=600 tabindex="-1"></canvas>
<div id="unity-loading-bar">
<div id="unity-logo"></div>
<div id="unity-progress-bar-empty">
<div id="unity-progress-bar-full"></div>
</div>
</div>
<div id="unity-warning"> </div>
<div id="unity-footer">
<div id="unity-webgl-logo"></div>
<div id="unity-fullscreen-button"></div>
<div id="unity-build-title">Cannon_Game#1</div>
</div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.2.0/socket.io.js"></script>
<script>
const socket = io('http://localhost:8080');
function boostHandler() {
console.log("BOOSTED!");
window.dispatchEvent(new KeyboardEvent('keydown', {
key: ' ',
code: 'Space',
keyCode: 32,
which: 32,
bubbles: false
}));
console.log("boosted succefully");
}
socket.on('boost', boostHandler);
</script>
</body>
</html>
Currently the spacebar is simulated only once and does not work with more than one request