Skip to content

Commit 71485fb

Browse files
chore(upload): clafiry how many requests are made, simplify controller to use single file, as the collections seem confusing sometimes
1 parent 39e6e4e commit 71485fb

File tree

1 file changed

+40
-35
lines changed

1 file changed

+40
-35
lines changed

components/upload/overview.md

Lines changed: 40 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -21,8 +21,10 @@ To use a Telerik Upload for Blazor
2121
@inject NavigationManager NavigationManager
2222
2323
<TelerikUpload SaveUrl="@SaveUrl" RemoveUrl="@RemoveUrl"
24+
SaveField="file" RemoveField="fileToRemove"
2425
AllowedExtensions="@( new List<string>() { ".jpg", ".png", ".jpeg" } )"
25-
MaxFileSize="2048000" MinFileSize="1024" />
26+
MaxFileSize="2048000" MinFileSize="1024">
27+
</TelerikUpload>
2628
2729
@code {
2830
// one way to define relative paths, put the desired URL here
@@ -41,7 +43,6 @@ To use a Telerik Upload for Blazor
4143
**C#**
4244

4345
using Microsoft.AspNetCore.Mvc;
44-
using System.Collections.Generic;
4546
using System.IO;
4647
using Microsoft.AspNetCore.Http;
4748
using Microsoft.AspNetCore.Hosting;
@@ -61,29 +62,26 @@ To use a Telerik Upload for Blazor
6162
}
6263

6364
[HttpPost]
64-
public async Task<IActionResult> Save(IEnumerable<IFormFile> files) // the default field name. See SaveField
65+
public async Task<IActionResult> Save(IFormFile file) // must match SaveField which defaults to "files"
6566
{
66-
if (files != null)
67+
if (file != null)
6768
{
6869
try
6970
{
70-
foreach (var file in files)
71-
{
72-
var fileContent = ContentDispositionHeaderValue.Parse(file.ContentDisposition);
73-
74-
// Some browsers send file names with full path.
75-
// We are only interested in the file name.
76-
var fileName = Path.GetFileName(fileContent.FileName.ToString().Trim('"'));
77-
var physicalPath = Path.Combine(HostingEnvironment.WebRootPath, fileName);
71+
var fileContent = ContentDispositionHeaderValue.Parse(file.ContentDisposition);
7872

79-
// Implement security mechanisms here - prevent path traversals,
80-
// check for allowed extensions, types, size, content, viruses, etc.
81-
// this sample always saves the file to the root and is not sufficient for a real application
82-
83-
using (var fileStream = new FileStream(physicalPath, FileMode.Create))
84-
{
85-
await file.CopyToAsync(fileStream);
86-
}
73+
// Some browsers send file names with full path.
74+
// We are only interested in the file name.
75+
var fileName = Path.GetFileName(fileContent.FileName.ToString().Trim('"'));
76+
var physicalPath = Path.Combine(HostingEnvironment.WebRootPath, fileName);
77+
78+
// Implement security mechanisms here - prevent path traversals,
79+
// check for allowed extensions, types, size, content, viruses, etc.
80+
// this sample always saves the file to the root and is not sufficient for a real application
81+
82+
using (var fileStream = new FileStream(physicalPath, FileMode.Create))
83+
{
84+
await file.CopyToAsync(fileStream);
8785
}
8886
}
8987
catch
@@ -100,25 +98,22 @@ To use a Telerik Upload for Blazor
10098

10199

102100
[HttpPost]
103-
public ActionResult Remove(string[] files) // the default field name. See RemoveField
101+
public ActionResult Remove(string fileToRemove) // must match RemoveField which defaults to "files"
104102
{
105-
if (files != null)
103+
if (fileToRemove != null)
106104
{
107105
try
108106
{
109-
foreach (var fullName in files)
110-
{
111-
var fileName = Path.GetFileName(fullName);
112-
var physicalPath = Path.Combine(HostingEnvironment.WebRootPath, fileName);
107+
var fileName = Path.GetFileName(fileToRemove);
108+
var physicalPath = Path.Combine(HostingEnvironment.WebRootPath, fileName);
113109

114-
if (System.IO.File.Exists(physicalPath))
115-
{
116-
// Implement security mechanisms here - prevent path traversals,
117-
// check for allowed extensions, types, permissions, etc.
118-
// this sample always deletes the file from the root and is not sufficient for a real application
110+
if (System.IO.File.Exists(physicalPath))
111+
{
112+
// Implement security mechanisms here - prevent path traversals,
113+
// check for allowed extensions, types, permissions, etc.
114+
// this sample always deletes the file from the root and is not sufficient for a real application
119115

120-
System.IO.File.Delete(physicalPath);
121-
}
116+
System.IO.File.Delete(physicalPath);
122117
}
123118
}
124119
catch
@@ -140,6 +135,8 @@ To use a Telerik Upload for Blazor
140135
141136
![Valid and Invalid files uploaded](images/upload-overview-validation.png)
142137

138+
>note The sample controller above takes only one field with the given name. If you already have existing controllers that handle files, it is possible that they accept `IEnumerable<IFormFile>` and `string[]` respectively. This will work with the Telerik Upload too - it simply allows for more fields with that name to be present in the request, while the Telerik component will add only one file (field).
139+
143140
>caption Component namespace and reference
144141
145142
````CSHTML
@@ -153,13 +150,21 @@ To use a Telerik Upload for Blazor
153150
>caption The Upload provides the following key features:
154151
155152
* `AutoUpload` - Specifies whether the upload of a file should start immediately upon its selection, or the user must click the "Upload" button. Defaults to `true`.
153+
156154
* `Enabled` - Whether the component is enabled for the end user.
155+
157156
* `Multiple` - Enables the selection of multiple files. If set to `false` (defaults to `true`), only one file can be selected at a time.
157+
158158
* `RemoveField` - Sets the `FormData` key which contains the file names submitted to the `RemoveUrl` endpoint when the user clicks the individual [x] button on the chosen files. Defaults to `files`.
159-
* `RemoveUrl`- Sets the URL of the endpoint for the remove request. The `FormData` request key is named after the `RemoveField` parameter. It contains the list of file names which should be removed from the server. The handler must accept POST requests which contain one or more fields with the same name as the `RemoveField`.
159+
160+
* `RemoveUrl`- Sets the URL of the endpoint for the remove request. The `FormData` request key is named after the `RemoveField` parameter. It contains the list of file names which should be removed from the server. The handler must accept POST requests which contain one or more fields with the same name as the `RemoveField`. The handler is hit once for each file.
161+
160162
* `SaveField` - Sets the `FormData` key which contains the files submitted to the `SaveUrl` endpoint. Defaults to `files`.
161-
* `SaveUrl`- The URL of the handler (endpoint, controller) that will receive the uploaded files. The handler must accept POST requests which contain one or more fields with the same name as the `SaveField`.
163+
164+
* `SaveUrl`- The URL of the handler (endpoint, controller) that will receive the uploaded files. The handler must accept POST requests which contain one or more fields with the same name as the `SaveField`. The handler is hit once for each file.
165+
162166
* `WithCredentials` - Controls whether to send credentials (cookies, headers) for cross-site requests (see the [XMLHttpRequest.withCredentials property](https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/withCredentials)). You can also add extra information to the request (such as authentication tokens and other metadata) through the `OnUpload` and `OnRemove` [events]({%slug upload-events%}).
167+
163168
* [Validation]({%slug upload-validation%})
164169

165170

0 commit comments

Comments
 (0)