How to use SignalR with cross domain?

404 Points
167 Posts


I am using signalr api to show live currency rate. I have implemented successfully in same domain in same project.
Now I want to create different project with singnalr to expose live currency. And from another client project we want to access that hub connection.
Is it posible? if yes how?

Views: 12197
Total Answered: 1
Total Marked As Answer: 1
Posted On: 09-Sep-2015 02:31

Share:   fb twitter linkedin
Rahul Maurya
Rahul M...
1402 Points
236 Posts

Hi Jak,

Follow the two simple step to show live currency rate

1. Create the project for signalr hub:

Create a standard c# project signalrdemo. Install SignalR via nuget. The following example gives the live currency per second.

Enable CORS:

We must enable CORS on the server so we can call it cross domain. Install Microsoft.Owin.Cors via nugget
Add class startup1.cs as:

using System;
using System.Threading.Tasks;
using Microsoft.Owin.Cors;
using Microsoft.Owin;
using Owin;
using Microsoft.AspNet.SignalR;
[assembly: OwinStartup(typeof(Startup1))]
public class Startup1
public void Configuration(IAppBuilder app)
//// For more information on how to configure your application, visit
// Branch the pipeline here for requests that start with "/signalr"
app.Map("/signalr", map =>
// Setup the CORS middleware to run before SignalR.
// By default this will allow all origins. You can
// configure the set of origins and/or http verbs by
// providing a cors options with a different policy.
var hubConfiguration = new HubConfiguration
// You can enable JSONP by uncommenting line below.
// JSONP requests are insecure but some older browsers (and some
// versions of IE) require JSONP to work cross domain
// EnableJSONP = true
// Run the SignalR pipeline. We're not using MapSignalR
// since this branch already runs under the "/signalr"
// path.


Create a Hub:

Lets create a class CurrencyHub by inheriting Hub as:


using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using Microsoft.AspNet.SignalR;
using System.Threading;
using System.Data;
using System.Threading.Tasks;
using System.Collections.Concurrent;
public class CurrencyHub : Hub
public static System.Timers.Timer _Timer;
public void SendCurrency()
if (_Timer == null)
_Timer = new System.Timers.Timer();
_Timer.Elapsed += (sender, e) => { OnTimedEvent_Live(""); };// new System.Timers.ElapsedEventHandler(OnTimedEvent_Live);
_Timer.Enabled = true;
_Timer.Interval = 1000;
private void OnTimedEvent_Live(string ReferrerURL)
public List<Currency> GetCurrencyAll_Live()
// return CurrencyList;

2. The client website (Javascript client):

Create the html page as (https://hubapplication is hub application host path):

<!DOCTYPE html>
<meta name="viewport" content="width=device-width" />
<script type="text/javascript" src="https://hubapplication/Scripts/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="https://hubapplication/Scripts/jquery.signalR-2.2.0.min.js"></script>
<script type="text/javascript" src="https://hubapplication/signalr/hubs"></script>
<link href="https://hubapplication/css/style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="https://hubapplication/Scripts/RealTimeCurrency.js"></script>
<script type="text/javascript">
$(function () {
$.connection.hub.url = "https://hubapplication/signalr";
var RealTimeCurrencyHub = $.connection.currencyHub;
RealTimeCurrencyHub.client.sendCurrencyLive = function (Currency) {
getCurrencyLive(Currency) //javascript method to update html table or div for currency.
$.connection.hub.start(function () {
//currency container
Posted On: 14-Sep-2015 03:37
 Log In to Chat