SingalR ASP.NET Cross Domain Connection Issue

Question

I am trying to implement an ASP.NET SignalR app as mentioned here.

I have implemented the client as mentioned here. For the client I am using code without the generated proxy.

Client and server successfully connect when both are on the same domain but unable to communicate when hosted cross domain. Although the code mentioned for cross domain in the above articles is already implemented. Since my client and server are hosted in Azure, is there a setting in Azure that needs to be enabled for cross domain communication or there is something else that I am missing?

Here is the error i am getting:

No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin is therefore not allowed access. The response had HTTP status code 500.

My startup class is:

public void Configuration(IAppBuilder app)
    {
        //app.UseCors(CorsOptions.AllowAll);

        // Any connection or hub wire up and configuration should go here
        //app.MapSignalR();
        // 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.
            map.UseCors(CorsOptions.AllowAll);
            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.
            map.RunSignalR(hubConfiguration);
        });

    }

And the client code is:`

        $(function (){
        var ChatServerUrl ="http://chatserverurl.net/home/";
        var ChatUrl = ChatServerUrl + "signalr";

        var connection = $.hubConnection(ChatUrl, { useDefaultPath: false });

        connection.logging = true;
        var chatHubProxy = connection.createHubProxy('chatHub');

        chatHubProxy.on('addNewMessageToPage', function (name, message) {

            console.log("AddNewMessageToPage Function!");

            // Add the message to the page.
            $('#discussion').append('<li><strong>' + htmlEncode(name)
                + '</strong>: ' + htmlEncode(message) + '</li>');
        });

        // Get the user name and store it to prepend to messages.
        $('#displayname').val(prompt('Enter your name:', ''));
        // Set initial focus to message input box.
        $('#message').focus();
        // Start the connection.
        //connection.start({ withCredentials : false }).done(function () {
        connection.start({ withCredentials: true }).done(function () {
            $('#sendmessage').click(function () {
                // Call the Send method on the hub.
                chatHubProxy.invoke('Send', $('#displayname').val(), $('#message').val());
                // Clear text box and reset focus for next comment.
                $('#message').val('').focus();
            });

            console.log("SignalR Connected!");
        });
    });`

Answer 1

Please try this according to what the below links suggest

https://learn.microsoft.com/en-us/aspnet/signalr/overview/guide-to-the-api/hubs-api-guide-javascript-client