Signal R and Sitecore
I have assigned a task to create a registration page, and
after successful registration the user name should be broadcast to everyone who is on the page.
So initially I thought of using Ajax Pooling and then
thought of using signal R as it needs a Real Time processing to continuously monitoring the user who are all registering.
Let’s get started to implement this with Sitecore MVC.
Step
1:
Add NuGet
Signal R package.
Step 2:
Add the HUB which includes all Services that accessible
from Client/Server
using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Threading;
using System.Threading.Tasks;
using System.Web;
using Microsoft.AspNet.SignalR;
namespace Sitecore.Feature.User.Repository
{
public class SignalRHub:Hub
{
public void Send(string userName)
{
// Call the UpdateRegisterUser method to update clients.
Clients.All.UpdateRegisterUser(userName);
}
}
}
Step3:
We will
initialize the Signal R by registering in the OWIN Configuration method with
the Path.
using System;
using Microsoft.AspNet.SignalR;
using
Microsoft.AspNet.SignalR.Configuration;
using Microsoft.Owin;
using Microsoft.Owin.Builder;
using Owin;
using Sitecore.Feature.User.Pipeline;
[assembly: OwinStartup("Sitecore.Feature.User.Pipeline.Startup", typeof(Sitecore.Feature.User.Pipeline.Startup))]
namespace Sitecore.Feature.User.Pipeline
{
public class Startup
{
public void Configuration(IAppBuilder app)
{
app.MapSignalR("/sitecore/signalr", new HubConfiguration() { });
}
}
}
Step 4:
By default Sitecore handle all the request through
routing, so we need to inform sitecore that request starts with “/sitecore/signal” should be omitted by
Sitecore so it will handled by Signal R
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using Sitecore;
using Sitecore.Configuration;
using Sitecore.Diagnostics;
using Sitecore.Pipelines.HttpRequest;
namespace Sitecore.Feature.User.Pipeline
{
public class ResolveSignalRPath : HttpRequestProcessor
{
public override void Process([NotNull] HttpRequestArgs
args)
{
if (args.Url.FilePath.StartsWith("/sitecore/signalr", StringComparison.OrdinalIgnoreCase))
{
args.AbortPipeline();
}
}
}
}
Step
5:
We should Sitecore aware of the ResolveSignalRPath class
to omit all the request to SignalR, so we will adding it to a config file (patch)
<?xml version="1.0" encoding="utf-8"?>
<configuration xmlns:patch="http://www.sitecore.net/xmlconfig/" xmlns:xdt="http://schemas.microsoft.com/XML-Document-Transform">
<sitecore>
<pipelines>
<httpRequestBegin>
<processor type="Sitecore.Feature.User.Pipeline. ResolveSignalRPath,Sitecore.Feature.User "
patch:before="processor[@type='Sitecore.Pipelines.HttpRequest.ItemResolver,
Sitecore.Kernel']"/>
</httpRequestBegin>
</pipelines>
</sitecore>
</configuration>
Step
6:
Add a View to where we going broadcast the user name in
realtime.
@{
Layout = null;
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,
initial-scale=1">
<script src="~/jquery.signalR-2.3.0.js"></script>
<!--Reference the autogenerated SignalR hub
script. -->
<script src="/sitecore/signalr/hubs"></script>
<script type="text/javascript">
function startHub() {
$.connection.hub.start().done(function () {
// Call the Send method on the hub.
chat.server.send("@TempData["UserName"]");
// Clear text box and reset focus for next comment.
}).fail(function () {
console.log("Connection failed...");
setTimeout(function () { startHub(); }, 2000); // Restart connection after 2 seconds.
});
}
var chat = $.connection.signalRHub;
chat.client.UpdateRegisterUser
= function (schoolName) {
//TODO:
code to display in UI.
}
$(document).ready(function () {
startHub();
});
</script>
That’s it J
Reference:
https://medium.com/@jackspektor/short-guide-to-how-to-setup-signalr-in-sitecore-solution-cee348e0c991
Comments
Post a Comment