SignalR Notification

abp.resourcemapping.js

module.exports = {
    aliases: {
        "@node_modules": "./node_modules",
        "@libs": "./wwwroot/libs"
    },
    clean: [
        "@libs"
    ],
    mappings: {
        "@node_modules/@microsoft/signalr/dist/browser/signalr.js": "@libs/signalr/",
        "@node_modules/@microsoft/signalr/dist/browser/signalr.js.map": "@libs/signalr/"
    }
};

Index.cshtml

@page
@model MyCompanyName.MyProjectName.Web.Pages.IndexModel
@using MyCompanyName.MyProjectName.Web.Menus
@using Volo.Abp.AspNetCore.Mvc.UI.Layout
@using Microsoft.AspNetCore.Mvc.Localization
@using MyCompanyName.MyProjectName.Localization
@using Volo.Abp.Users
@inject IPageLayout PageLayout
@inject IHtmlLocalizer<MyProjectNameResource> L
@{
    ViewBag.PageTitle = L["Home"];
    PageLayout.Content.Title = L["Home"].Value;
    PageLayout.Content.MenuItemName = MyProjectNameMenus.Home;
}

<script>

    var handleSignalR = function (response){
      $("#time").text(response.message);
    }

    var makePostRequest = function() {
        $.ajax({
           type: "POST",
           contentType: "application/json; charset=utf-8",
           dataType: "json"
        });
    };

    document.addEventListener('DOMContentLoaded', function(){
        myNotificationManager.messageListeners.notificationProcessMessages.push(handleSignalR);
    }, false);

    </script>

<h1 id="time"></h1>

Index.cshtml.cs

using System;
using System.Threading.Tasks;
using System.Timers;

namespace MyCompanyName.MyProjectName.Web.Pages
{
    public class IndexModel : MyProjectNamePageModel
    {
        private readonly UiNotificationClient _uiNotificationClient;

        public IndexModel(UiNotificationClient uiNotificationClient)
        {
            _uiNotificationClient = uiNotificationClient;
        }

        public async Task OnGet()
        {
            var timer = new Timer {
                Interval = 1000, //ticks every 1 second
                Enabled = true
            };

            timer.Elapsed += async (sender, args) =>
            {
                //sends server data to client
                await _uiNotificationClient.SendNotification("Server time is " + DateTime.Now.ToLongTimeString());
            };
        }
    }
}

INotificationClient.cs

using System.Threading.Tasks;

public interface INotificationClient
{
    Task ReceiveNotificationMessage(string message);
}

notification-hub.js

"use strict";

var hubName = "notification-hub";

var connection = new signalR.HubConnectionBuilder()
    .withUrl("/" + hubName)
    .withAutomaticReconnect()
    .configureLogging(signalR.LogLevel.Information)
    .build();

var myNotificationManager = $.extend({}, myNotificationManager, {
    messageListeners: {
        notificationProcessMessages: []
    }
});

connection.on("receiveNotificationMessage", function (message) {
    if (!myNotificationManager.messageListeners.notificationProcessMessages) {
        return;
    }

    myNotificationManager.messageListeners.notificationProcessMessages.forEach(function (fn) {
        fn({
            message: message
        });
    });
});

connection.start().then(function () {
    abp.log.info(hubName + " connected.");
}).catch(function (err) {
    abp.log.error(err.toString());
});

UiNotificationClient.cs

using System.Threading.Tasks;
using Microsoft.AspNetCore.SignalR;
using Volo.Abp.DependencyInjection;

public class UiNotificationClient : ITransientDependency
{
    private readonly IHubContext<UiNotificationHub, INotificationClient> _notificationHub;

    public UiNotificationClient(IHubContext<UiNotificationHub, INotificationClient> notificationHub)
    {
        _notificationHub = notificationHub;
    }

    public async Task SendNotification(string message)
    {
        await _notificationHub
            .Clients
            .All
            .ReceiveNotificationMessage(message);
    }
}

UiNotificationHub.cs

using System.Threading.Tasks;
using Microsoft.AspNetCore.SignalR;
using Volo.Abp.DependencyInjection;

public class UiNotificationHub : Hub<INotificationClient>, ITransientDependency
{
    public Task SendNotification(string message)
    {
        return Clients
            .Client(Context.ConnectionId)
            .ReceiveNotificationMessage(message);
    }
}