2013-05-11 20 views
5

Sto tentando di creare un client iOS PhoneGap per un server di chat SignalR di base in esecuzione (ASP.NET MVC 4). Tutto funziona alla perfezione quando si accede da una pagina di un browser, ma non riesco a connetterlo dall'app PhoneGap. Ecco le parti pertinenti del mio codice:Come connettersi a un hub SignalR dall'app PhoneGap su iOS?

global.asax Server

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); 
} 

web.config Server

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

hub Server client

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

PhoneGap

<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> 

Ho attraversato un sacco di siti che parlano di parti e parti di esso, ma non riesco a capire.

Grazie in anticipo, Jason

+0

http://www.asp.net/signalr/overview/hubs-api/hubs-api-guide-javascript-client#crossdomain. Leggi attentamente le note. – davidfowl

+0

Grazie per l'articolo dfowler. In realtà avevo rimosso la linea cors come menzionato nelle note come uno dei tanti passaggi di debug che ho fatto, ma non ha fatto alcuna differenza. In realtà non avevo mai trovato quel particolare articolo e sembra abbastanza buono, quindi lo esaminerò e vedrò se c'è qualcos'altro che potrebbe aiutare. – Jason

+0

Hai mai avuto fortuna con questo? Stavo cercando di testare la stessa cosa. – user441521

risposta

1

Spero che questo aiuta. Da qui ->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> 
Problemi correlati