File upload to s3 bucket from ej2 syncfusion control

Hi,

We are using Syncfusion ej2 angular Uploader component to upload files to server. Is there a way to upload the files directly to AWS S3 bucket? If there is a possibility, kindly send us an example of the same.


Thank you,

Kiruthika. K


3 Replies

PO Prince Oliver Syncfusion Team October 29, 2021 07:11 AM UTC

Hi Kiruthika, 

Thank you for contacting Syncfusion support. 

Currently we don’t support to direct upload to Amazon S3 bucket in the Uploader component. We have already consider this requirement as feature in our end. This will be included in any of our upcoming release. You can track the status of the feature through the following feedback link. 


Regards, 
Prince 



KK Kiruthika K October 29, 2021 10:10 AM UTC

Thanks team for your immediate reply. 

Can you please send us a workaround for this till the feature gets added? This would be of great help to us in our project.


Regards,

Kiruthika. K



BC Berly Christopher Syncfusion Team November 1, 2021 12:38 PM UTC

Hi Kiruthika, 
  
We can achieve the requested requirement with help of backend controller as mentioned in the below code example. 
  
ublic class HomeController : Controller  
    {  
        private const string bucketName = "*** provide bucket name ***";  
        private const string keyName = "*** provide a name for the uploaded object ***";  
        private const string filePath = "*** provide the full path name of the file to upload ***";  
        // Specify your bucket region (an example region is shown).  
        private static readonly RegionEndpoint bucketRegion = RegionEndpoint.USWest2;  
        private static IAmazonS3 s3Client;  
        public IActionResult Index()  
        {              
            return View();  
        }  
        private IHostingEnvironment hostingEnv;  
  
        public HomeController(IHostingEnvironment env)  
        {  
            this.hostingEnv = env;  
            s3Client = new AmazonS3Client(bucketRegion);  
        }  
        ...  
}  
public void Save(IList<IFormFile> chunkFile, IList<IFormFile> UploadFiles)  
        {  
            long size = 0;  
            try  
            {  
                // for chunk-upload  
                foreach (var file in chunkFile)  
                {  
                    var filename = ContentDispositionHeaderValue  
                                        .Parse(file.ContentDisposition)  
                                        .FileName  
                                        .Trim('"');  
                    filename = hostingEnv.WebRootPath + $@"\{filename}";  
                    size += file.Length;  
  
                    if (!System.IO.File.Exists(filename))  
                    {  
                        using (FileStream fs = System.IO.File.Create(filename))  
                        {  
                            file.CopyTo(fs);  
                            UploadFileAsync().Wait();  
                            fs.Flush();  
                        }  
                    }  
                    else  
                    {  
                        using (FileStream fs = System.IO.File.Open(filename, FileMode.Append))  
                        {  
                            file.CopyTo(fs);  
                            fs.Flush();  
                        }  
                    }  
                }  
            }  
 
private static async Task UploadFileAsync()  
        {  
            try  
            {  
                var fileTransferUtility =  
                    new TransferUtility(s3Client);  
  
                // Option 1. Upload a file. The file name is used as the object key name.  
                await fileTransferUtility.UploadAsync(filePath, bucketName);  
                Console.WriteLine("Upload 1 completed");  
  
                // Option 2. Specify object key name explicitly.  
                await fileTransferUtility.UploadAsync(filePath, bucketName, keyName);  
                Console.WriteLine("Upload 2 completed");  
  
                // Option 3. Upload data from a type of System.IO.Stream.  
                using (var fileToUpload =  
                    new FileStream(filePath, FileMode.Open, FileAccess.Read))  
                {  
                    await fileTransferUtility.UploadAsync(fileToUpload,  
                                               bucketName, keyName);  
                }  
                Console.WriteLine("Upload 3 completed");  
  
                // Option 4. Specify advanced settings.  
                var fileTransferUtilityRequest = new TransferUtilityUploadRequest  
                {  
                    BucketName = bucketName,  
                    FilePath = filePath,  
                    StorageClass = S3StorageClass.StandardInfrequentAccess,  
                    PartSize = 6291456, // 6 MB.  
                    Key = keyName,  
                    CannedACL = S3CannedACL.PublicRead  
                };  
                fileTransferUtilityRequest.Metadata.Add("param1""Value1");  
                fileTransferUtilityRequest.Metadata.Add("param2""Value2");  
  
                await fileTransferUtility.UploadAsync(fileTransferUtilityRequest);  
                Console.WriteLine("Upload 4 completed");  
            }  
            catch (AmazonS3Exception e)  
            {  
                Console.WriteLine("Error encountered on server. Message:'{0}' when writing an object", e.Message);  
            }  
            catch (Exception e)  
            {  
                Console.WriteLine("Unknown encountered on server. Message:'{0}' when writing an object", e.Message);  
            }  
  
        }  
 
  
  
 
  
 
Regards, 
Berly B.C 


Loader.
Up arrow icon