如何从iOS上的PhoneGap应用程序连接到SignalR集线器

How to connect to a SignalR hub from PhoneGap app on iOS?

本文关键字:连接 SignalR 集线器 应用程序 PhoneGap iOS 上的      更新时间:2023-09-26

我正在尝试为我运行的基本SignalR聊天服务器构建PhoneGap iOS客户端。当从浏览器中的页面访问它时,一切都很好,但我似乎无法从PhoneGap应用程序连接它。以下是我代码的相关部分:

服务器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>

我已经浏览了大量的网站,讨论它的点点滴滴,但无法弄清楚。

提前感谢,杰森

希望这对你有帮助。从这里-> 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>