Skip to content

Commit 41d4882

Browse files
zamronypjzamronypj
committed
separate documentation about file upload on dedicated page
1 parent 990b5de commit 41d4882

File tree

4 files changed

+125
-85
lines changed

4 files changed

+125
-85
lines changed

‎documentation/index.md‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,7 @@ description: Documentation and developer's resources for Fano Framework, web app
2828

2929
- [Working with Request](/working-with-request). It explains how to get query string parameters, read POST data and work with file upload.
3030
- [Working with Response](/working-with-response). It explains how to return response in various format such as HTML, JSON or binary response, for example, image.
31+
- [Handling File Upload](/handling-file-upload). It explains how to work with file upload.
3132
- [Working with Session](/working-with-session). It explains how to manage state between requests.
3233

3334
## MVC

‎handling-file-upload/index.md‎

Lines changed: 114 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,114 @@
1+
---
2+
title: Handling File Upload
3+
description: Tutorial on how to work with file upload in Fano Framework
4+
---
5+
6+
<h1 class="major">Handline file upload</h1>
7+
8+
If you have form like following snippet
9+
10+
```
11+
<form action="/submit" method="post" enctype="multipart/form-data">
12+
<input type="text" name="username" value="test">
13+
<input type="file" name="myFile">
14+
<button type="submit">Submit</button>
15+
</form>
16+
```
17+
18+
To retrieve value of `username` is same as with POST data.
19+
20+
```
21+
var username : string;
22+
...
23+
username := request.getParsedBodyParam('username');
24+
```
25+
26+
To retrieve file uploaded by client, you need to call `getUploadedFile()`. It returns data of type `IUploadedFileArray` which array of `IUploadedFile` instance.
27+
28+
29+
```
30+
var myFile : IUploadedFileArray;
31+
...
32+
myFile := request.getUploadedFile('myFile');
33+
```
34+
35+
Client can send one or more file with same name, for example:
36+
37+
```
38+
<form action="/submit" method="post" enctype="multipart/form-data">
39+
<input type="text" name="username" value="test">
40+
<input type="file" name="myFile">
41+
<input type="file" name="myFile">
42+
<button type="submit">Submit</button>
43+
</form>
44+
```
45+
46+
If client upload one or more files, `length(myFile)` will indicates how many
47+
files actually uploaded.
48+
49+
## Move uploaded file
50+
51+
Initially, uploaded file will be stored in system temporary directory. You need to
52+
call `moveTo()` methods to move into permanent location.
53+
54+
```
55+
if (length(myFile) > 0) then
56+
begin
57+
myFile[0].moveTo(targetUploadPath);
58+
end;
59+
```
60+
`targetUploadPath` is full filename (including its target directory). You must make sure that `targetUploadPath` is writeable. Exception `EInOutError` is raised when
61+
uploaded file can not be written to target path.
62+
63+
## Get uploaded file size
64+
65+
Size of uploaded file in octet (or bytes) can be queried with `size()` method.
66+
67+
```
68+
var fSize : int64;
69+
...
70+
fSize := myFile[0].size();
71+
```
72+
73+
## Get file MIME type
74+
75+
MIME type of uploaded file can be queried with `getClientMediaType()` method.
76+
For example, if upload JPEG image, you may get `image/jpeg`.
77+
78+
```
79+
var mime : string;
80+
...
81+
mime := myFile[0].getClientMediaType();
82+
```
83+
84+
If client does not send any MIME type (aka Content Type) then it is assumed
85+
`application/octet-stream`.
86+
87+
## Get original file name
88+
89+
To get original file name of uploaded file use `getClientFilename()` method.
90+
91+
```
92+
var filename : string;
93+
...
94+
filename := myFile[0].getClientFilename();
95+
```
96+
97+
If client does not send filename then it returns empty string.
98+
99+
For example how to handle file upload with Fano Framework, see
100+
[Fano Upload](https://github.com/fanoframework/fano-upload).
101+
102+
## File Upload Validation
103+
104+
Fano Framework validation feature provides several built-in validation rule that you can use to [validate against file upload](/security/form-validation/built-in-validation-rules#uploaded-file) such as to verify that field is indeed a file upload, to verify that file upload match certain MIME type or more advanced use such as antivirus scan validation or file format validation.
105+
106+
## Explore more
107+
108+
- [Working with response](/working-with-response)
109+
- [Working with request](/working-with-request)
110+
- [Form Validation](/security/form-validation)
111+
112+
<ul class="actions">
113+
<li><a href="/documentation" class="button">Documentation</a></li>
114+
</ul>

‎security/form-validation/built-in-validation-rules/index.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -307,7 +307,7 @@ rule := TBeforeDateTimeFieldValidator.create('event-end-date');
307307

308308
Above rule makes current field passes validation only if its value is prior than the value in `event-end-date` field.
309309

310-
## Uploaded file
310+
## <a name="uploaded-file"></a>Uploaded file
311311

312312
### TUploadedFileValidator
313313

‎working-with-request/index.md‎

Lines changed: 9 additions & 84 deletions
Original file line numberDiff line numberDiff line change
@@ -122,109 +122,34 @@ msg1 := request.getParam('msg1', 'ok');
122122

123123
Above method search query string parameter first. If it cannot find data with key `msg1`, it tries to read body parameters. If none found, default value 'ok` is returned.
124124

125-
## Handling file upload
125+
## Read request header
126126

127-
If you have form like following snippet
128-
129-
```
130-
<form action="/submit" method="post" enctype="multipart/form-data">
131-
<input type="text" name="username" value="test">
132-
<input type="file" name="myFile">
133-
<button type="submit">Submit</button>
134-
</form>
135-
```
136-
137-
To retrieve value of `username` is same as with POST data.
138-
139-
```
140-
var username : string;
141-
...
142-
username := request.getParsedBodyParam('username');
143-
```
144-
145-
To retrieve file uploaded by client, you need to call `getUploadedFile()`. It returns data of type `IUploadedFileArray` which array of `IUploadedFile` instance.
146-
147-
148-
```
149-
var myFile : IUploadedFileArray;
150-
...
151-
myFile := request.getUploadedFile('myFile');
152-
```
153-
154-
Client can send one or more file with same name, for example:
155-
156-
```
157-
<form action="/submit" method="post" enctype="multipart/form-data">
158-
<input type="text" name="username" value="test">
159-
<input type="file" name="myFile">
160-
<input type="file" name="myFile">
161-
<button type="submit">Submit</button>
162-
</form>
163-
```
164-
165-
If client upload one or more files, `length(myFile)` will indicates how many
166-
files actually uploaded.
167-
168-
### Move uploaded file
169-
170-
Initially, uploaded file will be stored in system temporary directory. You need to
171-
call `moveTo()` methods to move into permanent location.
172-
173-
```
174-
if (length(myFile) > 0) then
175-
begin
176-
myFile[0].moveTo(targetUploadPath);
177-
end;
178-
```
179-
`targetUploadPath` is full filename (including its target directory). You must make sure that `targetUploadPath` is writeable. Exception `EInOutError` is raised when
180-
uploaded file can not be written to target path.
181-
182-
### Get uploaded file size
127+
To get request headers, use `headers()` methods of `IRequest`. It returns instance of `IReadOnlyHeaders` interface.
183128

184-
Size of uploaded file in octet (or bytes) can be queried with `size()` method.
129+
To read request header value, call `getHeader()` method and pass header to read. For example to read `Accept-Language` header value,
185130

186131
```
187-
var fSize : int64;
132+
var acceptLang : string;
188133
...
189-
fSize := myFile[0].size();
134+
acceptLang := request.headers().getHeader('Accept-Language');
190135
```
191136

192-
### Get file MIME type
193-
194-
MIME type of uploaded file can be queried with `getClientMediaType()` method.
195-
For example, if upload JPEG image, you may get `image/jpeg`.
196-
197-
```
198-
var mime : string;
199-
...
200-
mime := myFile[0].getClientMediaType();
201-
```
202-
203-
If client does not send any MIME type (aka Content Type) then it is assumed
204-
`application/octet-stream`.
205-
206-
### Get original file name
207-
208-
To get original file name of uploaded file use `getClientFilename()` method.
137+
To test availability of header, call `has()` method. For example to test if `Accept-Language` header is set,
209138

210139
```
211-
var filename : string;
140+
var langAvail : boolean;
212141
...
213-
filename := myFile[0].getClientFilename();
142+
langAvail := request.headers().has('Accept-Language');
214143
```
215144

216-
If client does not send filename then it returns empty string.
217-
218-
For example how to handle file upload with Fano Framework, see
219-
[Fano Upload](https://github.com/fanoframework/fano-upload).
220-
221145
## Explore more
222146

223147
- [Working with response](/working-with-response)
224148
- [Working with Controllers](/working-with-controllers)
225149
- [Working with Views](/working-with-views)
226150
- [Form Validation](/security/form-validation)
227151
- [Handling CORS](/security/handling-cors)
152+
- [Handling File Upload](/handling-file-upload)
228153

229154
<ul class="actions">
230155
<li><a href="/documentation" class="button">Documentation</a></li>

0 commit comments

Comments
 (0)