Создание приложения календаря с помощью MEAN, который прослушивает изменения

Question

Я подумываю о запуске своего рода веб-приложения для календаря, чтобы я смог попрактиковаться и улучшить свои навыки веб-разработки. Я разрабатывал структуру и применяемые технологии и, наконец, решил использовать стек MEAN. Я столкнулся с проблемой: я хотел бы «автоматически обновить» угловой интерфейс в случае добавления новых событий в календарь (например, если новое событие добавляется из другой вкладки или даже с другого компьютера и, возможно, в будущее от приложения для смартфона). Как правильно получить эти обновления? Я думал об использовании метода collection.watch () из mongodb, чтобы определить, когда документ, связанный с учетной записью, изменился, а затем socket.io, но я должен сделать это на стороне сервера или на стороне клиента? И затем, если я делаю это на стороне сервера, как мне обновить угловое изображение? Ну, я надеюсь, что я был достаточно ясен и что я не настолько смущен, что то, что я планирую, не имеет смысла. Спасибо!

Answer 1

Я настоятельно рекомендую использовать для этого Метеор .Этот тип обновлений сервера -> клиента - это именно то, для чего он предназначен.В приведенном ниже примере предполагается, что в качестве движка рендеринга используется blaze, но он работает так же хорошо, как реагирование, vue или angular.

У вас есть файл сервера:

const events = new Mongo.Collection("events");
Meteor.publish("events", function(some, arguments) {
   return events.find({some mongo query});
});

на стороне клиента, у вас есть код JS:

const events = new Mongo.Collection("events");
Meteor.subscribe("events", some, arguments);

Template.someTemplate.helpers({
  events() {
    return events.find();
  }
});

и код HTML:

<template name="someTemplate">
{{#each event in events}}
 <!-- do something with the event -->
{{/each}}
</template>

Answer 2

Итак, вы в основном на правильном пути со своими мыслями. Вы можете использовать сокет IO для этого проекта. Я бы посоветовал вам следовать примеру приложения чата на веб-странице сокетов ввода-вывода:

Приложение Socket IO Chat

В основном сокет io - это технология на стороне сервера:

NODEJS:

var app = require('express')();
var http = require('http').createServer(app);
var io = require('socket.io')(http);

app.get('/', function(req, res){
  res.sendFile(__dirname + '/index.html');
});

io.on('connection', function(socket){
  socket.on('chat message', function(msg){
    io.emit('chat message', msg);
  });
}); 

http.listen(3000, function(){
  console.log('listening on *:3000');
});

Что позволяет браузеру подключаться через веб-сокет к серверу. Соединение websocket позволяет браузеру общаться в режиме реального времени.

FRONT-END

<script>
  $(function () {
    var socket = io();
    $('form').submit(function(e){
      e.preventDefault(); // prevents page reloading
      socket.emit('chat message', $('#m').val());
      $('#m').val('');
      return false;
    });
    socket.on('chat message', function(msg){
      $('#messages').append($('<li>').text(msg));
    });
  });
</script>