Using SignalR 2.0 to connect to a hub without relying on a proxy

By using the HTML/JS code below, I have been able to successfully connect to my SignalR 2.0 hub when both the HTML/JS and hub are on the same server.

<!DOCTYPE html>
<html>
<head>
<title>Test SignalR 2.0</title>
<style type="text/css">
    .container {
        background-color: #99CCFF;
        border: thick solid #808080;
        padding: 20px;
        margin: 20px;
    }
</style>
</head>
<body>
<div class="container">
    <input type="text" size=100 id="message" />
    <input type="button" id="sendmessage" value="Send" />
</div>
<ul id="discussion"></ul>
<!--Script references. -->
<script src="Scripts/jquery-1.6.4.min.js"></script>
<script src="Scripts/jquery.signalR-2.0.3.min.js"></script>
<script src="/signalr/hubs"></script>

<script type="text/javascript">
    $(function () {
        //Instantiating Hub-Class
        var srv = $.connection.pvHub;

        // Definition of function called by HUB (Server)
        srv.client.receiveData = function (message) {
            var encodedMsg = $('<div />').text(message).html();
            $('#discussion').append('<ul>' + encodedMsg + '</ul><br>');
        };

        // Start the connection.
        $.connection.hub.start().done(function () {
            $('#sendmessage').click(function () {
                // call HUB function (on Server)
                srv.server.getBnoData($('#message').val());
                // Clear text box and reset focus for next comment.
                $('#message').val('').focus();
            });

        });
    });
</script>

Now, I am attempting to connect to the hub with the same HTML/JS file located on a client's machine. However, I have not been successful. It seems like there may be some issues with the hub proxy and the URL of my hub during the connection instantiation and start process. I am unsure how to resolve this problem specifically.

Any suggestions or ideas?

Thank you.

Answer №1

To ensure Cross Domain support, follow these steps:

http://www.asp.net/signalr/overview/signalr-20/hubs-api/hubs-api-guide-javascript-client#crossdomain

If you have already configured it, make sure to update your client code to direct to the correct endpoint. Change the relative /signalr/hubs address to an absolute one and specify a valid absolute URL for $.connection.hub.url. For example:

<script src="http://foo.com/signalr/hubs"></script>
<script>

    ...
    $.connection.hub.url = 'http://foo.com/signalr';
    ...

</script>

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

What is the proper way to request permission for allowing others to access the mailto function?

I want to create a feature where users can open email on click using JavaScript. However, I have encountered an issue with using the mailto function in Chrome, as it requires changing the handlers settings to make it work. My query is whether it is possib ...

Making modifications to the database will trigger real-time updates in the web interface. How is it possible to achieve this seamlessly?

Can someone please help me understand how to automatically insert news or new events from a Facebook page as an event in a webpage? I am a programmer and currently, the data is retrieved from the database using AJAX without reloading the page. However, I ...

Issue encountered when attempting to synchronize Protractor with the page: "unable to locate Angular on the window" while executing a Protractor test case

Currently, I am conducting tests on an Angular website. Our application flow begins with a Login page followed by a vertical application selection frame (located in the left corner of the page) that consists of non-Angular web pages. Once the user selects ...

Designating a maximum duration in the vercel.json configuration file for an Express.js project

After upgrading to a Pro plan on Vercel for hosting my Express app, I expected the maxDuration to be automatically increased from 10 seconds to 60 seconds. However, it seems that I need to explicitly specify the maxDuration value in my vercel.json file. He ...

Angular 4 Issue: Child Routing Dysfunction

I'm encountering an issue with the child routing in Angular 4. The parent routing is functioning correctly, but when I hover over "Create New Account," it remains on the Account page instead of redirecting to localhost:4200/account/create-account. The ...

The AJAX request seems to be malfunctioning despite the fact that both the PHP and JS files function correctly independently

I have set up an AJAX call and tested the JS file by alerting out the POST values being sent along with the data string. Everything seems fine at that point. I then passed these values to the PHP file where they are required, making sure to keep it simple ...

Storing identical keys in a key-value pair within Angular for efficient data management

Is there a way to store duplicate keys in a key value pair in Angular? For example: I need to store - 101 , 999 101 , 989 101 , 987 102 , 888 102 , 887 I attempted the following code: commentMap = new Map<number, number>(); this.commentMa ...

Utilizing a datareader with an ASP chart control

In my current development process, I am working with a datareader that is expected to call a stored procedure and then bind the resulting query data to a chart. Here is the specific dataset that I intend to bind to the chart: ForecastDesc Previous ...

What can you do to prevent a div from taking up the entire page if its height is not specified?

Currently, I am experiencing an issue with my layout. I have a hidden div with a fixed position that becomes visible when a button on the page is clicked. Inside this div, there is a table of buttons for the user to choose from. The problem arises when I ...

Bugfender is reporting a ReferenceError stating that it can't locate the variable BroadcastChannel

While Bugfender works well in my Vue.js application on Chrome, I am experiencing issues with it on my Safari Mac. Specifically, I am encountering an error in the browser console that says "ReferenceError: Can't find variable: BroadcastChannel". This i ...

Progress bar for AJAX file loading for Flash player

Looking to create a progress bar using AJAX for a flash file. Check out this demo here: I tried to analyze their page, but the JavaScript is encrypted and I'm not very skilled in JS. Any suggestions? Thank you! ...

Using ReactJS and JavaScript to transform an array into a fresh array

I am working with an array that looks like this: var oldArray = [ {number: '12345', alphabet: 'abcde'}, {number: '54321', alphabet: 'abcde'}, {number: '67891', alphabet: 'abcde'}, ...

Enhancing the aesthetic appeal of a form

I have created a form in HTML that utilizes JavaScript to pull data from a database. I am looking to style the form, but I'm unsure of how to proceed. Below is the form along with some CSS code. How can I integrate the two together? <form id=" ...

What is the best way to apply a function to every value of a property within a javascript object?

I have an object structured like this. It will continue with more children blocks in a similar format. My goal is to replace the value of "date" throughout the entire object with a version processed through NLP. { "date": "next friday" ...

Exploring the transition from the login screen to the home screen in React Native with the help of React Navigation

Currently, I am working on a small app using react native. As I am not very familiar with react, I would appreciate any help I can get. My main objective is to implement react navigation in the app, specifically redirecting authenticated users to the home ...

Inconsistency in displaying updated values in AngularJS directives

I am facing an issue where I need to postpone the compilation of a child directive until a promise in the parent directive's prelink function is resolved and a value (CONFIG) is updated. Within the Parent's preLink: somePromise.then(functio ...

Struggling to formulate a JSON structure for Treebeard in ReactJS

Seeking guidance on creating JSON structure in React using data traversal methods like the map function. I have experience building JSON in C# with LINQ and lists, but transitioning to ReactJS has left me uncertain about the approach. const prodData = { ...

Join the Observable in Angular2 Newsletter for the latest updates and tips

One of my functions stores the previous URL address. prevId () { let name, id, lat, lng; this.router.events .filter(event => event instanceof NavigationEnd) .subscribe(e => { console.log('prev:', this.previo ...

Having a Jquery resizing problem? No worries! When the width is less than 768, simply enable the click option. And when the width is

HTML <div class="profile"> <a href="#" class="hoverdropdown" onclick="return false;">Profile</a> <ul class="dropdown" style="display: none;"> <li><a href="#">Dashboard&l ...

What occurs in the event of a server crash following the scheduling of a task using cron?

Imagine I set a task to take place at time t2 in the future, where t1 < t2 < t3 If the server crashes at time t1, will the scheduled task still run if the server is restarted before t2 (t1 < t < t2)? What happens if the server crashes at t1 a ...