2013-05-11 12 views
5

Ich versuche, einen PhoneGap iOS Client für einen grundlegenden SignalR Chat-Server zu bauen, den ich ausgeführt habe (ASP.NET MVC 4). Alles funktioniert gut, wenn Sie von einer Seite in einem Browser auf es zugreifen, aber ich kann es einfach nicht scheinen, es von der PhoneGap App zu verbinden. Hier ist die relevanten Teile meines Codes:Wie stelle ich eine Verbindung zu einem SignalR Hub von der PhoneGap App auf iOS her?

Server global.asax

protected void Application_Start() 
{ 
    // Register the default hubs route: ~/signalr * This must be registered before any other routes 
    RouteTable.Routes.MapHubs(new HubConfiguration { EnableCrossDomain = true }); 

    AreaRegistration.RegisterAllAreas(); 

    WebApiConfig.Register(GlobalConfiguration.Configuration); 
    FilterConfig.RegisterGlobalFilters(GlobalFilters.Filters); 
    RouteConfig.RegisterRoutes(RouteTable.Routes); 
} 

Server web.config

<configuration> 
    <system.webServer> 
     <modules runAllManagedModulesForAllRequests="true"></modules> 
    </system.webServer> 
</configuration> 

Server Hub

public class ChatHub : Hub 
{ 
    public void Send(string name, string message) 
    { 
     Clients.All.broadcastMessage(name, message); 
    } 
} 

PhoneGap Client

<body> 
    <div data-role="page"> 

     <div data-role="header"> 
      <h1>Life As A Pixel</h1> 
     </div><!-- /header --> 

     <div data-role="content"> 
      <label for="username">Name:</label> 
      <input type="text" name="username" id="username" value="" /> 
      <label for="message">Message:</label> 
      <input type="text" name="message" id="message" value="" /> 
      <br> 
      <input type="button" value="Send" id="sendmessage" /> 
     </div><!-- /content --> 

     <div data-role="footer" data-position="fixed"> 
      <h4></h4> 
     </div><!-- /footer --> 
    </div><!-- /page --> 

    <script type="text/javascript" src="cordova-2.7.0.js"></script> 
    <script type="text/javascript" src="js/index.js"></script> 
    <script type="text/javascript" src="js/jquery-1.9.1.js"></script> 
    <script type="text/javascript" src="js/jquery.mobile-1.3.1.js"></script> 
    <script type="text/javascript" src="js/jquery.signalR-1.0.0-rc1.min.js"></script> 
    <script type="text/javascript" src="http://www.mysite.com/signalr/hubs"></script> 
    <script type="text/javascript"> 
     app.initialize(); 
    </script> 
    <script type="text/javascript"> 
     $(function() { 
      // Declare a proxy to reference the hub 
      jQuery.support.cors = true; 
      $.connection.hub.url = 'http://www.mysite.com/signalr'; 
      var chat = $.connection.chatHub; 
      alert(chat); 
      //alert(chat); 
      // Create a function that the hub can call to broadcast messages. 
      //chat.client.broadcastMessage = function (name, message) { 
      //$('#discussion').append('<li><strong>' + name 
      //      + '</strong>:&nbsp;&nbsp;' + message + '</li>'); 
      //}; 
      // Set initial focus to message input box. 
      //$('#message').focus(); 
      // Start the connection. 
      $.connection.hub.start({ jsonp: true }).done(function() { 
       alert("connected"); 
       $('#sendmessage').click(function() { 
        // Html encode display name and message. 
        var encodedName = $('<div />').text($('#username').val()).html(); 
        var encodedMsg = $('<div />').text($('#message').val()).html(); 
        // Call the Send method on the hub. 
        chat.send(encodedName, encodedMsg); 
        // Clear text box and reset focus for next comment. 
        $('#message').val('').focus(); 
       }); 
      }).fail(function() { 
       alert("Failed to connect"); 
      }); 
     }); 
     </script> 
</body> 

Ich habe eine Menge Seiten durchgespielt, die über Teile davon sprechen, aber nicht herausgefunden werden können.

Vielen Dank im Voraus, Jason

+0

http://www.asp.net/signalr/overview/hubs-api/hubs-api-guide-javascript-client#crossdomain. Lesen Sie aufmerksam die Notizen. – davidfowl

+0

Danke für den Artikel dfowler. Ich hatte tatsächlich die Korsareitung entfernt, wie in den Anmerkungen erwähnt, als eine der vielen Debug-Schritte, die ich durchging, aber es machte keinen Unterschied. Ich war nicht wirklich auf diesen speziellen Artikel gestoßen und er sieht ziemlich gut aus, also werde ich ihn durchgehen und sehen, ob da noch etwas anderes drin ist, das helfen könnte. – Jason

+0

Hattest du jemals etwas Glück dabei? Ich wollte das gleiche ausprobieren. – user441521

Antwort

1

Ich hoffe, das hilft. Von hier ->http://agilefromthegroundup.blogspot.com/2012/09/getting-signalr-and-phonegap-working.html

<!DOCTYPE html> 
<html> 
<head> 
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" /> 
<meta http-equiv="Content-type" content="text/html; charset=utf-8" /> 
<title>Chat</title> 
<link rel="stylesheet" href="jquery.mobile-1.0.1.css" /> 
<script type="text/javascript" src="jquery-1.7.1.js"></script> 
<script type="text/javascript" src="jquery.mobile-1.0.1.js"></script> 
<script type="text/javascript" src="http://jgough/SignalR/Scripts/jquery.signalR-0.5.3.js"></script> 
<script type="text/javascript" src="http://jgough/SignalR/signalr/hubs"></script> 
<script type="text/javascript" charset="utf-8" src="phonegap-1.4.1.js"></script> 
<style type="text/css"> 
    .ui-title 
    { 
     font-weight: bold; 
    } 
</style> 
<script type="text/javascript"> 
    $(function() { 
     $.connection.hub.url = "http://jgough/SignalR/signalr"; 

     // Grab the hub by name, the same name as specified on the server 
     var chat = $.connection.chat; 

     chat.addMessage = function (message) { 
      $('#chatMessages').append('<li>' + message + '</li>'); 
     }; 

     $.connection.hub.start({ jsonp: true }); 

     $("#sendChatMessage").click(function() { 
      var message = $("#chatMessage").val(); 
      console.log("Message: " + message); 
      chat.send(message); 
     }); 
    }); 
</script> 
</head> 
<body> 
<div id="home" data-role="page"> 
    <div data-role="header"> 
     <h1> 
      Chat!</h1> 
    </div> 
    <div data-role="content"> 
     <h2> 
      Chat your heart out...</h2> 
     <div> 
      <textarea id="chatMessage"></textarea> 
      <br /> 
      <a id="sendChatMessage" data-role="button">Send Chat Message</a> 
     </div> 
     <ul id="chatMessages"> 
     </ul> 
    </div> 
    <div data-role="footer" data-position="fixed"> 
     Thank you for chatting 
    </div> 
</div> 
</body> 
</html> 
Verwandte Themen