ChunkUpload.razor

@page "/File-Upload/Chunk-Upload"

@using Syncfusion.Blazor.Inputs

@inherits SampleBaseComponent;

<SampleDescription>
    <p>This example demonstrates the chunk upload functionalities of the Uploader control. Browse or drag-and-drop a large file to upload with pause, resume, and retry options. </p>
</SampleDescription>
<ActionDescription>
   <p>When the file size is large or transfer the file with slow network connection, the chunk upload feature slices the files and upload the sliced chunks to server in sequential order using the <a href='https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.Inputs.AsyncSettingsModel.html#Syncfusion_Blazor_Inputs_AsyncSettingsModel_ChunkSize' target='_blank'>chunkSize</a> API.</p>
   <p>The sample is configured with the following options:</p>
       <ul>
         <li>While uploading, you can pause the upload and resume it later.</li>
         <li> If the upload fails, retry option will be enabled.</li>
         <li> The sample is configured with maximum file size as `100 MB` to upload.</li>
       </ul>
   <p>More information on the Uploader instantiation can be found in this <a target='_blank' href='https://blazor.syncfusion.com/documentation/file-upload/chunk-upload/'>documentation section</a>.</p>
</ActionDescription>

<div class="col-lg-12 control-section">
    <div class="control_wrapper">
        <SfUploader ID="UploadFiles" DropArea=".control-fluid" MaxFileSize=104857600>
            <UploaderAsyncSettings SaveUrl="https://aspnetmvc.syncfusion.com/services/api/uploadbox/Save" RemoveUrl="https://aspnetmvc.syncfusion.com/services/api/uploadbox/Remove" ChunkSize=500000></UploaderAsyncSettings>
        </SfUploader>
    </div>
</div>

<style>
    .control_wrapper {
        width: 350px;
        margin: 0 auto;
    }
</style>