Question

我正在使用SignalR连接设计类似于谷歌文档的实时文档编辑器Web应用程序。

它工作正常，即当我在浏览器中的一个编辑器中编写时，文本正在我拥有的其他打开的浏览器上显示。我唯一的问题是，当我开始写一些文本时，它没有被显示，然后我再次删除并写入，一切正常。

当我在Chrome中使用F12进行调试时，我收到此错误：

Uncaught Error: SignalR: Connection has not been fully initialized. Use .start().done() or        .start().fail() to run logic after the connection has started.

我不明白这一点，因为在我的代码中我实际上使用$ .connection.hub.start.done（）。这是我正在使用的中心：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using Microsoft.AspNet.SignalR;
using Microsoft.AspNet.SignalR.Hubs;

namespace Write.ly
{
    [HubName("editor")]
    public class EditorHub : Hub
    {
        public void Send(string message)
        {
            Clients.Others.broadcastMessage(message);
        }
    }
}

这是与此相关的JavaScript和HTML。请注意，我使用tinyMCE作为编辑器的插件。

@{
    ViewBag.Title = "- Editor";
    ViewBag.ContentStyle = "/Content/CSS/editor.css";
}

<script src="~/Scripts/jquery.signalR-1.0.1.min.js"></script>
<script src="~/signalr/hubs"></script>
<script src="~/Content/TinyMCE/tiny_mce.js"></script>
<script type="text/javascript">
    $(function () {
        var hub = $.connection.editor;

        tinyMCE.init({
            mode: "textareas",
            theme: "advanced",
            plugins: "emotions,spellchecker,advhr,insertdatetime,preview",

            // Theme options - button# indicated the row# only
            theme_advanced_buttons1: "newdocument,|,bold,italic,underline,|,justifyleft,justifycenter,justifyright,fontselect,fontsizeselect,formatselect",
            theme_advanced_buttons2: "cut,copy,paste,|,bullist,numlist,|,outdent,indent,|,undo,redo,|,link,unlink,anchor,image,|,code,preview,|,forecolor,backcolor",
            theme_advanced_buttons3: "insertdate,inserttime,|,spellchecker,advhr,,removeformat,|,sub,sup,|,charmap,emotions",
            theme_advanced_toolbar_location: "top",
            theme_advanced_toolbar_align: "left",
            theme_advanced_statusbar_location: "bottom",
            theme_advanced_resizing: false,

            setup: function (ed) {
                ed.onKeyUp.add(function (ed, e) {
                    hub.client.broadcastMessage = function (message) {
                        var bookmark = ed.selection.getBookmark(2, true);
                        tinyMCE.activeEditor.setContent(message);
                        ed.selection.moveToBookmark(bookmark);
                    };

                    $.connection.hub.start().done(function () {
                        var text = tinyMCE.activeEditor.getContent();
                        hub.server.send(text);
                    });
                });
            }
        });
    });
</script>

<form method="post" action="somepage">
        <textarea id="editor" name="content" cols="100" rows="30"></textarea>
</form>

<button class="btn" onclick="ajaxSave();"><span>Save</span></button>

有什么想法吗？

Answer 1

您应该只启动一次SignalR连接，而不是每个keyup。您还应该在开始连接之前创建客户端集线器方法：

<script type="text/javascript">
    $(function () {
        var hub = $.connection.editor;

        tinyMCE.init({
            mode: "textareas",
            theme: "advanced",
            plugins: "emotions,spellchecker,advhr,insertdatetime,preview",

            // Theme options - button# indicated the row# only
            theme_advanced_buttons1: "newdocument,|,bold,italic,underline,|,justifyleft,justifycenter,justifyright,fontselect,fontsizeselect,formatselect",
            theme_advanced_buttons2: "cut,copy,paste,|,bullist,numlist,|,outdent,indent,|,undo,redo,|,link,unlink,anchor,image,|,code,preview,|,forecolor,backcolor",
            theme_advanced_buttons3: "insertdate,inserttime,|,spellchecker,advhr,,removeformat,|,sub,sup,|,charmap,emotions",
            theme_advanced_toolbar_location: "top",
            theme_advanced_toolbar_align: "left",
            theme_advanced_statusbar_location: "bottom",
            theme_advanced_resizing: false,

            setup: function (ed) {
                hub.client.broadcastMessage = function (message) {
                    var bookmark = ed.selection.getBookmark(2, true);
                    tinyMCE.activeEditor.setContent(message);
                    ed.selection.moveToBookmark(bookmark);
                };

                $.connection.hub.start().done(function () {
                    ed.onKeyUp.add(function (ed, e) {
                        var text = tinyMCE.activeEditor.getContent();
                        hub.server.send(text);
                    });
                });
            }
        });
    });
</script>

Connection.Start（）。完成（）SignalR问题

1 个答案: