Blazor Server（.NET 6）搭配Azure SignalR时文件下载故障排查求助

问题根源 #

Azure SignalR作为中转服务，会打断Blazor Server原生流下载依赖的直接WebSocket链路——本地SignalR是客户端与服务器直接建立连接，而Azure SignalR做中转代理后，无法传递服务器端发起的流下载请求，导致无响应但无报错。

可行解决方案 #

1. 临时文件/外部存储下载（推荐，支持大文件）

绕开SignalR链路，先将文件生成到服务器临时目录或Azure Blob存储，再返回下载地址给客户端，通过原生HTTP请求触发下载：

• 服务器端代码：

// 生成文件并保存到临时目录
var tempFileName = $"temp-{Guid.NewGuid()}.xlsx";
var filePath = Path.Combine(Path.GetTempPath(), tempFileName);
await GenerateFileToStreamAsync(File.Create(filePath));

// 返回临时下载路径（若用Azure Blob则生成SAS授权URL）
return $"/temp-downloads/{tempFileName}";

• 客户端Blazor组件：

<button @onclick="TriggerDownload">下载文件</button>

@code {
    [Inject] private HttpClient Http { get; set; }
    [Inject] private IJSRuntime JSRuntime { get; set; }

    private async Task TriggerDownload()
    {
        var downloadUrl = await Http.GetFromJsonAsync<string>("api/files/generate");
        await JSRuntime.InvokeVoidAsync("initFileDownload", downloadUrl, "报表.xlsx");
    }
}

• 客户端JS（wwwroot/js/download.js）：

window.initFileDownload = (url, fileName) => {
    const link = document.createElement('a');
    link.href = url;
    link.download = fileName;
    document.body.appendChild(link);
    link.click();
    document.body.removeChild(link);
};

• 注意：需在Startup/Program.cs中配置静态文件访问临时目录，同时添加定时任务清理过期临时文件。

2. SignalR传递字节数组（仅适合小文件）

将文件转为字节数组通过SignalR发送到客户端，再转Blob触发下载：

• 服务器端Hub方法：

public async Task<byte[]> FetchFileBytes()
{
    using var stream = new MemoryStream();
    await GenerateFileToStreamAsync(stream);
    return stream.ToArray();
}

• 客户端Blazor组件：

<button @onclick="DownloadViaSignalR">下载文件</button>

@code {
    [Inject] private HubConnection HubConnection { get; set; }
    [Inject] private IJSRuntime JSRuntime { get; set; }

    private async Task DownloadViaSignalR()
    {
        var fileBytes = await HubConnection.InvokeAsync<byte[]>("FetchFileBytes");
        await JSRuntime.InvokeVoidAsync("downloadFromBytes", fileBytes, "报表.xlsx");
    }
}

• 客户端JS：

window.downloadFromBytes = (bytes, fileName) => {
    const blob = new Blob([bytes], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
    const url = URL.createObjectURL(blob);
    const link = document.createElement('a');
    link.href = url;
    link.download = fileName;
    document.body.appendChild(link);
    link.click();
    document.body.removeChild(link);
    URL.revokeObjectURL(url);
};

3. 确认Azure SignalR服务模式

登录Azure Portal，检查SignalR服务的服务模式必须设置为Default——Serverless模式不支持Blazor Server的持久连接场景，会导致这类依赖链路的功能异常。

内容的提问来源于stack exchange，提问作者Ray