如何從iOS上的PhoneGap應用程序連接到SignalR集線器？

我正在嘗試爲我運行的基本SignalR聊天服務器（ASP.NET MVC 4）構建PhoneGap iOS客戶端。從瀏覽器中的頁面訪問它時，一切都很好，但我似乎無法從PhoneGap應用程序連接它。這裏是我的代碼的相關部分：如何從iOS上的PhoneGap應用程序連接到SignalR集線器？

服務器的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); 
}

服務器的web.config

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

服務器樞紐

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>

我已經經歷了很多網站，談論它的點點滴滴，但無法弄清楚。

在此先感謝，傑森

來源

2013-05-11 Jason

http://www.asp.net/signalr/overview/hubs-api/hubs-api-guide-javascript-client#crossdomain。仔細閱讀筆記。 – davidfowl 2013-05-12 09:52:19

感謝文章dfowler。我實際上已經刪除了筆記中提到的cors行，作爲我經歷的許多調試步驟之一，但它沒有任何區別。我實際上並沒有遇到那篇特別的文章，它看起來很不錯，所以我會仔細閱讀它，看看有沒有其他的東西可以幫助。 – Jason 2013-05-13 15:26:01

你有沒有碰運氣？我期待着測試同樣的事情。 – user441521 2015-02-10 00:32:17

我希望這有助於。從這裏開始 - >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>

來源

2014-04-02 14:30:11 Matt

如何從iOS上的PhoneGap應用程序連接到SignalR集線器？

回答

相關問題