Как нажимать уведомления с помощью angular.js?

Я создаю простое приложение для изучения angular.js. Пока я подключил все части в стеке MEAN, и я могу сохранять и извлекать данные из Mongo.

Приложение по существу является списком задач. Пользователь может создать проект, а внутри проекта создать "карты" с "todos", которые затем могут быть перенесены из состояния в состояние ( "отставание", "в процессе", "завершено" и т.д.).

Я хотел бы иметь возможность нажимать уведомления всем людям, которые подключены, чтобы сообщить своим приложениям, что обновление необходимо для получения последних todos. Другими словами, допустим, что пользователь A добавляет новую карту для проекта A, я хотел бы отправить сообщение всем пользователям, которые в настоящее время смотрят проект A, чтобы их приложение выдает обновление проекта, чтобы получить самую последнюю версию.

Любые предложения о том, как действовать? Какую технологию, если она есть, мне нужно добавить в стек MEAN, чтобы иметь возможность сделать что-то вроде этого?

Заранее спасибо

Ответ 1

Поскольку вы находитесь в стеке MEAN, стандартная рекомендация в Node будет заключаться в использовании API Socket.IO.

Они предоставляют следующий пример двухсторонней передачи сообщений (что очень упростит ваши push-сообщения):

Client

<script src="/socket.io/socket.io.js"></script>
<script>
  var socket = io.connect('http://localhost');
  socket.on('news', function (data) {
    console.log(data);
    socket.emit('my other event', { my: 'data' });
  });
</script>

Сервер

var app = require('http').createServer(handler)
  , io = require('socket.io').listen(app)
  , fs = require('fs')

app.listen(80);

function handler (req, res) {
  fs.readFile(__dirname + '/index.html',
  function (err, data) {
    if (err) {
      res.writeHead(500);
      return res.end('Error loading index.html');
    }

    res.writeHead(200);
    res.end(data);
  });
}

io.sockets.on('connection', function (socket) {
  socket.emit('news', { hello: 'world' });
  socket.on('my other event', function (data) {
    console.log(data);
  });
});

Он будет использовать websockets, где это возможно, и отказать в длинном опросе AJAX или опросе Flash в браузерах, где нет поддержки websocket.

Что касается интеграции с Angular, здесь хорошее сообщение в блоге Socket.IO и Angular:

Я расскажу о том, как интегрировать Socket.IO для добавления в реальном времени функции приложения AngularJS. В этом уроке я собираюсь пройдите через приложение для обмена мгновенными сообщениями.

Ответ 2

Если вы уже работаете с Express, вы должны проверить express.io.

В нем есть множество интересных функций, таких как поддержка сеанса и возможность пересылки обычных маршрутов HTTP в маршруты в реальном времени.

Ответ 3

Вот модуль, который мы написали для получения push-уведомлений AngularJS, работающих в PhoneGap/Cordava (с полными инструкциями): http://www.scorchsoft.com/blog/free-angularjs-cordova-push-notification-plugin/

Просто загрузите пример кода и установите. Существует также код для настройки pushing-компонента в PHP.

Ответ 4

Почему бы не с HTML5 Notification API....

export default class NotificationService {
    /**
     * Constructor of the class.
     *
     */
    constructor() {}

    showPushNotification(title: string = '', message: string, iconPush) {
        if (window.Notification && Notification.permission !== "denied") {
            Notification.requestPermission(function(status) {
                var n = new Notification(title, {
                    body: message,
                    icon: iconPush
                });
            });
        }

    }
}