如何为网站撰写通知？

Question

I am building a website for myself. I use MongoDB, feathers.js, Node.js and Angular 5. I would like to add Notification for it. It looks like notification's StackOverflow.

I don't need push Notification. Just want a red highlight exactly like notification's StackOverflow when I do some specific events. I am new so please give me details about what I need to write both front and back end or some good sources about it. Thank in advanced.

Answer 1

Create a service that requests notifications from the server side via HTTP. Your component that should show that red dot will use that service and change its state depending on the response from that service. Here is the example of working with HTTP: HTTP in Angular So, create a service that requests from server notifications. Then, create a component that does the representation logic, utilizing the service you created (it is done with Dependency Injection like here ).

Answer 2

There are two approaches to achieve this.

• You can use polling to get the notification for a user. In polling, the client makes a request after a specific interval, say 5 min, to the server, to ask whether there is any new notification or not. Then with the type of response you can show/hide the notification symbol

• The other approach is when you use socket connection between the server and and the client to establish the communication. When ever a notification needs to be sent to the user, the server pushes the notification via socket connection rather than waiting for the client to make a request.

Both the approaches has got its own pros and cons, polling is much faster to implement but is not a good practice when you have millions of customers, because you server resource gets occupied. Also polling would have some delay sending the notification since it is client depended.

Advice : If you are starting to implement is for few thousand users or hobby project, then go for polling. Consider socket connections only when you have the urgent need to show notification with zero lag and your customer base is atleast few millions.

Answer 3

If you are using socketio with feathers then its easy to implement this.

Read about it in event channels .

The idea is to create a channel in your server to get a hold of the connected users via socket.

app.on('connection', connection => {
   app.channel('anonymous').join(connection);
});

Then if a service method is called, inform the connections in the channel.

app.service('notifications').publish('created', (data, context) => {
  return app.channel('anonymous');
});

Then in your client side you will get the published data by listening to the method event.

app.service('notifications').on('created', notification => {
      console.log('notification created', notification);
   });

Then if you want a live example, try feathers chat