У меня есть форма, которая запускает поток через router.post() при нажатии start
button.Когда кнопка запуска нажата.
Когда нажата кнопка остановки, я запускаю сокет event, который останавливает потоковую передачу с сервера.
- Я использую on_stream boolean для установки true / falseфлаги для запуска / остановки потока.
ПРОБЛЕМА: Когда кнопка запуска / остановки нажимается в ПЕРВЫЙ раз, поток запускается и останавливается правильно. Второй раз, когда нажимается кнопка запуска, router.post () публикует ДВАЖДЫ на сервер.А когда нажимается кнопка STOP, событие сокета генерируется дважды.
С этого момента кнопки запуска / остановки вызывают экспоненциально множественные пост-запросы (запуск) и события сокета (остановка потока),Сбой кода ...
Консоль после повторного запуска и остановки (несколько событий post и socket)
Stoping Stream...
SOCKET DEF: true
Closing stream...
close stream: false
startz undefined
POST DEF: false
startStream DEF: true
starting stream...
POST / 200 12.608 ms - 4
startz undefined
POST DEF: true
startStream DEF: true
starting stream...
Консоль браузера (события запускаются несколько раз) : https://imgur.com/a/RDGR9mm
index.js
module.exports = function(io) {
let _stream = {};
let on_stream = false;
router.post('/', async (req, res) => {
// console.log("raw obj " + req.body.searchTerm);
console.log("startz " + req.body.startBtn);
console.log("POST DEF:", on_stream);
startStream(req.body.searchTerm);
res.send(on_stream);
});
io.on('connection', function(socket) {
console.log('a user connected index outside routerrr');
// Listen to stop Button being clicked
socket.on('stopStream', function() {
console.log("Stoping Stream...");
if(on_stream) {
console.log("SOCKET DEF:", on_stream);
closeStream();
}
});
});
// start stream
function startStream(term) {
// return new Promise((resolve, reject) => {
// console.log("TERM _" +term);
client.stream('statuses/filter', { track: term }, function(stream) {
_stream = stream;
on_stream = true;
console.log("startStream DEF:", on_stream);
console.log("starting stream...");
_stream.on('data', function(tweet) {
console.log(tweet.text + "Streaming");
// socket.emit('tweet', tweet.text);
});
_stream.on('error', function(error) {
console.log("erorr:: " + error);
throw error;
});
});
}
function closeStream() {
console.log('Closing stream...');
_stream.destroy();
on_stream = false;
console.log("close stream: ", on_stream );
}
return router;
}
script.js
function startSearchForm() {
$("#startBtn").on('click', function() {
let form = $("#search-form");
let query = form.serialize();
console.log(query);
$.post('/', query);
});
}
function stopSearchForm() {
$("#stopBtn").on('click', function() {
let startSearchValue = $("#searchTerm").val("");
console.log("Stop Stream...");
socket.emit('stopStream', function(data) {
console.log("Stream Stop Complete");
});
// let form = $("#searchStop-form");
// let query = form.serialize();
// console.log(query);
// $.post('/', query);
});
}
index.pug
form#search-form(action='javascript:startSearchForm()', method='POST')
input(type="text" id="searchedTerm" name="searchTerm" placeholder="#hastag" required)
button(type="submit" name="startBtn" id="startBtn") Search
form#searchStop-form(action='javascript:stopSearchForm()', method='POST')
input(type="text" id="stopSearch" name="stopSearch" value="stopSearch" hidden)
button(type="submit" id="stopBtn" name="stopBtn") Stop