Here are a couple of recommendations:
1) For smaller files, such as images and attachments, consider sending them base64encoded over the wire while being mindful of payload limits defined in your webapi's web.config file.
In your entity model, include a property:
fileAsBase64: string
This allows you to convert a file from the dropzone component into a base64 string using the following method:
getBase64(file) {
return new Promise((resolve, reject) => {
const reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = () => resolve(reader.result);
reader.onerror = (error) => reject(error);
});
On the C# side, define the file as a string and use it to convert the string back to a byte array:
public class UploadedFileDto
{
public string Name { get; set; }
public string FileAsBase64 { get; set; }
[JsonIgnore]
public string MimeType => Regex.Match(FileAsBase64, @"data:(?<type>.+?);base64,(?<data>.+)").Groups["type"].Value;
[JsonIgnore]
public byte[] Bytes =>
Convert.FromBase64String(Regex.Match(FileAsBase64, @"data:(?<type>.+?);base64,(?<data>.+)").Groups["data"].Value);
}
2) When dealing with larger files, consider sending the files in a separate call to the server and saving them temporarily. You will also need a function to clean these temporary files. Here is a controller snippet that includes size checks and only allows PDF files:
public async Task<HttpResponseMessage> Upload()
{
Dictionary<string, object> dict = new Dictionary<string, object>();
try
{
var httpRequest = HttpContext.Current.Request;
foreach (string file in httpRequest.Files)
{
HttpResponseMessage response = Request.CreateResponse(HttpStatusCode.Created);
var postedFile = httpRequest.Files[file];
if (postedFile != null && postedFile.ContentLength > 0)
{
int MaxContentLength = 1024 * 1024 * 50; //Size = 50 MB
IList<string> AllowedFileExtensions = new List<string> { ".pdf" };
var ext = postedFile.FileName.Substring(postedFile.FileName.LastIndexOf('.'));
var extension = ext.ToLower();
if (!AllowedFileExtensions.Contains(extension))
{
var message = string.Format("Please upload file of type .pdf");
dict.Add("error", message);
return await Task.FromResult(Request.CreateResponse(HttpStatusCode.BadRequest, dict));
}
else if (postedFile.ContentLength > MaxContentLength)
{
var message = string.Format("Please upload a file upto 50 mb.");
dict.Add("error", message);
return await Task.FromResult(Request.CreateResponse(HttpStatusCode.BadRequest, dict));
}
else
{
_fileService.SaveUploadedFile(postedFile);
}
}
var message1 = string.Format("File uploaded Successfully.");
return await Task.FromResult(Request.CreateResponse(HttpStatusCode.OK, message1)); ;
}
var res = string.Format("Please upload a pdf.");
dict.Add("error", res);
return Request.CreateResponse(HttpStatusCode.BadRequest, dict);
}
catch (Exception ex)
{
Log.Error(ex);
var res = string.Format("Errors occured");
dict.Add("error", res);
return await Task.FromResult(Request.CreateResponse(HttpStatusCode.InternalServerError, dict));
}
}