1.0.1 • Published 6 years ago
angularjs-fine-uploader v1.0.1
Angular fine uploader
A simple angularjs directive based on Fine-Uploader.
Functions
- upload-service-url: Your endpoint to upload the file
- delete-file-service-url: Your endpoint to delete the file
- on-success-upload-callback: Your callback function after successful upload
- max-size-kb: maximum allowed file size to upload
- max-allowed-items: Maximum allowed files to upload
- allowed-extensions: Allowed file extensions for uploading the files like 'jpeg,jpg,gif,png,pdf,js'
Attention
- See the usage in demo project
Sample server side code for C# :
[HttpPost]
public async Task<FileUploaderResult> UploadFile()
{
var folderName = "uploads";
var PATH = HttpContext.Current.Server.MapPath("~/" + folderName);
var rootUrl = Request.RequestUri.AbsoluteUri.Replace(Request.RequestUri.AbsolutePath, String.Empty);
if (Request.Content.IsMimeMultipartContent())
{
var streamProvider = new CustomMultipartFormDataStreamProvider(PATH);
var task = Request.Content.ReadAsMultipartAsync(streamProvider).ContinueWith<FileUploaderResult>(t =>
{
if (t.IsFaulted || t.IsCanceled)
{
throw new HttpResponseException(HttpStatusCode.InternalServerError);
}
var fileInfo = streamProvider.FileData.Select(i => {
var info = new FileInfo(i.LocalFileName);
return new FileUploaderResult(info.Name, rootUrl + "/" + folderName + "/" + info.Name, info.Length / 1024, true);
}).First();
return fileInfo;
});
return await task;
}
else
{
throw new HttpResponseException(Request.CreateResponse(HttpStatusCode.NotAcceptable, "This request is not properly formatted"));
}
}
[HttpDelete]
public async Task DeleteFile(Guid id)
{
await myBusiness.DeleteFileAsync(id);
}
and your CustomMultipartFormDataStreamProvider class looks like this:
public class CustomMultipartFormDataStreamProvider : MultipartFormDataStreamProvider
{
public CustomMultipartFormDataStreamProvider(string path) : base(path)
{
}
public override string GetLocalFileName(System.Net.Http.Headers.HttpContentHeaders headers)
{
var name = !string.IsNullOrWhiteSpace(headers.ContentDisposition.FileName) ? headers.ContentDisposition.FileName : "NoName";
return name.Replace("\"", string.Empty); //this is here because Chrome submits files in quotation marks which get treated as part of the filename and get escaped
}
}
and your FileUploadReault class looks like this:
public class FileUploaderResult
{
public string Name { get; set; }
public string Path { get; set; }
public long Size { get; set; }
public bool Success { get; set; }
public FileUploaderResult(string name, string path, long size, bool success)
{
Name = name;
Path = path;
Size = size;
Success = success;
}
}