Uploading Larger Files In Razor Components

Just a short note on enabling larger transfers in Razor Components.

By default, the SignalR buffer is set at about 18KB in a new Razor Components application.

This limits how much data you can transfer between Browser and Server as you will see errors such as this if you overflow this buffer:

System.InvalidOperationException: Advancing examined to the end would cause pipe to deadlock because FlushAsync is waiting.

The current solution is to add some SignalR options to your Razor Components Configure method in Startup.cs (Server Project)

I am not advocating always changing these values, and I'm not saying set them to zero - but I have certainly been able to upload 13MB images this way. YMMV.

Choose a buffer size that works for you seems to be the current advice.

Sample Project

I have created a sample project on Github https://github.com/SQL-MisterMagoo/RCFileUpload

This project simply demonstrates how to upload multiple image files to the server and displays a gallery of images.

Extra Reading

After working on this for a while, I found this old post https://www.radzen.com/blog/read-image-base64-blazor-signalr/ by Vladimir Enchev, which takes a similar, approach - but slightly different in that their code only handles single file uploads at a time, while my sample shows a method for handling multiple files. But I would recommend reading Vladimir's post - the more information you get, the better your understanding.