Upload File using specific HttpClient

[Mason Channer]

How would I call the api endpoints if it is protected by auth?  

On UploaderAsyncSettings I do not see a place to specify the HttpClientInstance to use Like you can do on SfDataManager.

<SfUploader ID="UploadFiles" AllowMultiple=false>

                    <UploaderAsyncSettings SaveUrl="api/Files/attachments" RemoveUrl="api/Files/delete">

                    </UploaderAsyncSettings>

                    <UploaderEvents Success="@((args)=>UploadSuccess(args,"btnImage",(context as MainCategoryDetail)))"></UploaderEvents>

                </SfUploader>

[Berly Christopher]

Hi Mason Channer, 

  

Greetings from Syncfusion support. 

  

We would like to inform you that the uploader component allows you to add additional header (authentication details) on file upload, and s be received in the server-side. You can achieve this behavior using FileSelected / BeforeUpload event and its CurrentRequest argument by configure header as key-value pair.     

  

@using Syncfusion.Blazor.Inputs   

<SfUploader ID="UploadFiles">   

    <UploaderEvents FileSelected="onFileSelect"></UploaderEvents>   

    <UploaderAsyncSettings SaveUrl="api/SampleData/Save">   

    </UploaderAsyncSettings>   

</SfUploader>   

   

@code {   

   

    private void onFileSelect(SelectedEventArgs args)   

    {   

        var accessToken = "Basic test123";   

        args.CurrentRequest = new List<object> { new { Authorization = accessToken } };   

    }   

   

}   

[SampleDataController.cs]   

[HttpPost("[action]")]   

        public async void Save(IList<IFormFile> UploadFiles)   

        {   

            //to get authorization Header to handle save file on server side     

            var authorizationHeader = Request.Headers["Authorization"];   

            try   

            {   

                foreach (var file in UploadFiles)   

                {   

                    if (UploadFiles != null)   

                    {   

                        var filename = ContentDispositionHeaderValue.Parse(file.ContentDisposition).FileName.Trim('"');   

                        filename = hostingEnv.WebRootPath + $@"\{filename}";   

                        if (!System.IO.File.Exists(filename))   

                        {   

                            using (FileStream fs = System.IO.File.Create(filename))   

                            {   

                                file.CopyTo(fs);   

                                fs.Flush();   

                            }   

                        }   

                        else   

                        {   

                            Response.Clear();   

                            Response.StatusCode = 204;   

                            Response.HttpContext.Features.Get<IHttpResponseFeature>().ReasonPhrase = "File already exists.";   

                        }   

                    }   

                }   

                Response.Headers.Add("ID", "Failure"); // Assign the custom data in the response header.   

            }   

            catch (Exception e)   

            {   

                Response.Clear();   

                Response.ContentType = "application/json; charset=utf-8";   

                Response.StatusCode = 204;   

                Response.HttpContext.Features.Get<IHttpResponseFeature>().ReasonPhrase = "File failed to upload";   

                Response.HttpContext.Features.Get<IHttpResponseFeature>().ReasonPhrase = e.Message;   

            }   

               

        }   

 

 

  

Please find the sample from the below link. 

Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/BlazorApp1-21746819  

  

Regards, 

Berly B.C