Я создавал свой последний годичный проект с использованием MERN, после почти завершения моего проекта передо мной встала задача обновить данные моего веб-сайта в режиме реального времени из базы данных. Во-первых, я нашел обходной путь для регулярного обновления моего компонента реакции, чтобы axios мог вызывать внутренний API для обновления данных. Это самый неэффективный способ обновления данных. Итак, наконец, я решил использовать socket.io для создания соединения в реальном времени.
Читая блоги, я столкнулся с тем, что если я буду следить за этими блогами, мне нужно полностью изменить свой бэкенд веб-приложения. Все блоги использовали сокет только для создания соединения с серверной частью, но я уже использовал экспресс для создания соединения. Я просмотрел разные блоги, а затем решил просмотреть документацию, чтобы узнать, как работает сокет. Я узнал, что могу использовать экспресс для создания порта и передать путь к серверу функции сокета, чтобы подключить мое сокетное соединение к экспрессу.
Вот код для бэкэнда для сокета: -
var data = require(‘./fetch.js’);
const server = app.listen(port, function() {
console.log('работает на локальном хосте: ‘ + порт);
});
const io = require(‘socket.io’)(сервер);
io.on('connection', (client) =› {
client.on('getData', (interval) =› {
console.log('client подписывается на таймер с interval ', interval);
setInterval(() =› {
MongoClient.connect('MONGO_URI', function (err, db) {
if (err) {
throw err;
client.emit('data', err);
} else {
data.getData(db,(err, result) =› {
if (err) {
client.emit('data', err);
} else {
ans=result;
client.emit('data', ans);
}
});
}
db.close();
});
}, интервал);
});
});
Сокет подключается к монго, чтобы получить данные из коллекции и отправить их клиенту. В приведенном выше коде fetch.js — это API, написанный для получения данных для формирования любой коллекции Mongo. Код для fetch.js выглядит следующим образом:
module.exports = {
getData:function(db,cb){
попробовать{
vardatabase=db.db('balon_parkplatz');
varcollection=database.collection('greaternoida');
коллекция.find().toArray(функция(ошибка, результаты) {
если (ошибка) {
метать;
} иначе {
cb(результаты);
}
});
}
поймать (ошибка) {
cb(ошибка);
}
}
}
Следующее, что нужно было сделать, это заставить клиента выдать «getData», который будет перехватываться внутренним сокетом. Для реагирования я использовал socket.io-client для отправки «getData» на серверную часть. Код для сокета в сочетании с реакцией приведен ниже: -
импортировать openSocket из socket.io-client;
const socket = openSocket(‘ http://localhost:8000 ‘);
function getStatus(cb) {
socket.on('data',parking_status =›cb(null,parking_status));
socket.emit('getData', 2000);
>
экспортировать getStatus по умолчанию;
Приведенный выше код отправляет «getData» клиенту и получает «данные», которые отправляются с сервера для создания соединения в реальном времени между бэкэндом и интерфейсом.