如何使用 SignalR 发送图像？答案

【问题标题】：How can I send image using SignalR?如何使用 SignalR 发送图像？
【发布时间】：2021-03-25 04:47:15
【问题描述】：

我构建了一个应用程序，前端是 Angular 10，后端是 .net core 5，通过这个应用程序，人们可以实时聊天和发送图像。我可以使用 signalR 实现聊天功能，但我不知道如何发送图像，请给我一个强有力的参考来帮助我做到这一点

【问题讨论】：

stackoverflow.com/questions/24304673/… 或 damienbod.com/2018/05/13/…

标签： javascript c# angular .net-core signalr

【解决方案1】：

一种解决方案是使用 signalR 将文件作为 base64 字符串发送。

您可以在客户端使用 javascript FileReader 类将文件转换为相应的 base64 格式。例如

const toBase64 = (file) => new Promise((resolve, reject) => {
    const reader = new FileReader();
    reader.readAsDataURL(file);
    reader.onload = () => resolve(reader.result);
    reader.onerror = error => reject(error);
});

async function Main() {
   const file = document.querySelector('#myfile').files[0];
   console.log(await toBase64(file));
}

Main();

然后您可以为上传的文件创建一个类服务器端，例如：

public class SignalRFileUpload {
    public string FileName { get; set; }
    public string ContentType { get; set; }
    public string FileContent { get; set; }
}

然后您可以像使用任何其他数据一样使用 signalR 发送文件。

然后您可以将它们作为字符串存储在服务器上，或者使用以下方法将它们转换为 byte[]：

Convert.FromBase64String(FileContent);

这个解决方案应该适用于几 MB 左右的较小图像。任何比这更大的，我相信它会成为问题。我以前从未尝试过，所以我不能确定。

【讨论】：