C# 信号聊天应用程序发送图像

我根据教程构建了SingnalR聊天应用程序MVC5 signalR 2.0：-

---

尽管有没有发送图片/附件的方法，但所有这些都工作得非常出色？图像实际显示在屏幕上吗？

否。信号器是一种文本基信号。 您所能做的就是发送URL、json。。 或者你可以考虑转移一个图像的Base64字符串表示，但我敢打赌它不是非常流行的用例。

< P> Jabbr（基于IrrSalr的基于IRC的基于Web的聊天系统）的方式是将文件从客户端上传到Azure Bulb容器（通过服务器端上传处理程序）然后将直接BLOBURI发送回直接访问该文件的所有客户端

---

查看此处的代码：

我建议您-通过WebApi（无信号器）发送图像和消息，然后通过信号器通知聊天中的所有参与者。

使用文件输入引导插件（krajee）上载此文件 您也可以不使用此插件上传文件

   @section Page{

<script src="~/Scripts/bootstrap-switch.min.js"></script>
<script src="~/Scripts/Uploader/fileinput.js"></script>
<link href="~/Scripts/Uploader/fileinput.css" rel="stylesheet" />
<script>
    var itemHub = $.connection.ItemHub;
$(document).ready(function() {
    $.connection.hub.start().done(function() {

       //do any thing

    });
     $("#fileinput").fileinput({
         allowedFileExtensions: ["jpg", "png", "gif", "jpeg"],
         maxImageWidth: 700,
         maxImageHeight: 700,
         resizePreference: 'height',
         maxFileCount: 1,
         resizeImage: true
     });


     $("#fileinput").on('fileloaded', function (event, file, previewId, index, reader) {


         var readers = new FileReader();
         readers.onloadend = function () {
             $(".file-preview-image").attr('src', readers.result);
         }
         readers.readAsDataURL(file);
     });




    $('#btnSave').click(function() {
        var imagesJson = $('.file-preview-image').map(function () {
            var $this = $(this);
            return {
                image: $this.attr('src'),
                filename: $this.attr('data-filename')
            };
        }).toArray();

        itemHub.server.getByteArray(imagesJson);
    });
});

</script>
}

@节页{
var itemHub=$.connection.itemHub；
$（文档）.ready（函数（）{
$.connection.hub.start（）.done（函数（））{
//做任何事
});
$（“#fileinput”）.fileinput({
允许的文件扩展名：[“jpg”、“png”、“gif”、“jpeg”]，
最大宽度：700，
最大高度：700，
resizePreference:“高度”，
maxFileCount:1，
调整图像大小：true
});
$（“#fileinput”）.on（'fileloaded'，函数（事件、文件、预览、索引、读取器）{
var readers=newfilereader（）；
readers.onloadend=函数（）{
$（“.file预览图像”）.attr（'src'，readers.result）；
}
readers.readAsDataURL（文件）；
});
$（'#btnSave'）。单击（函数（）{
var imagesJson=$（'.file预览图像'）.map（函数（）{
var$this=$（this）；
返回{
图像：$this.attr（'src'），
文件名：$this.attr（'data-filename'））
};
}).toArray（）；
itemHub.server.getByteArray（imagesJson）；
});
});
}

集线器类别代码

[HubName("ItemHub")]
public class ItemHub : Hub
{
      public void GetByteArray(IEnumerable<ImageData> images)
      {
         foreach (var item in images ?? Enumerable.Empty<ImageData>())
         {
            var tokens = item.Image.Split(',');
            if (tokens.Length > 1)
            {
               byte[] buffer = Convert.FromBase64String(tokens[1]);

            }
          }
      }
}

public class ImageData
{
    public string Description { get; set; }
    public string Filename { get; set; }
    public string Image { get; set; }
}

[HubName（“ItemHub”）]
公共类ItemHub:Hub
{
public void GetByteArray（IEnumerable图像）
{
foreach（图像中的变量项？？Enumerable.Empty（））
{
var tokens=item.Image.Split（'，'）；
如果（tokens.Length>1）
{
byte[]buffer=Convert.FromBase64String（标记[1]）；
}
}
}
}
公共类图像数据
{
公共字符串说明{get；set；}
公共字符串文件名{get；set；}
公共字符串图像{get；set；}
}

我认为您实际上是在通过信号器发送指向资源的URL。如果人们使用web api，则无法进行一对一的文件传输。无论如何，如何通过web api传输文件？@Mikhail您能详细说明您的答案并提供您的答案的原因吗？是否有“Hello World”这样的例子？