- Configuration
for HTTP upload -
Configuration is
split in two kind of parameters: Regular parameters
and Extra parameters. A regular parameter is
defined by design whereas an Extra parameter is
dynamic and allows passing custom HTTP parameters to
server-side. Regular parameter syntax is:
paramName : paramValue,
But Extra parameter syntax is a pair.
Up to 24 extra parameter can be defined.
param1 : paramName,
value1 : paramValue,
Parameters |
Description and
example |
Mandatory |
url |
Web server URL string that will
process the upload. It could be the URL
of PHP, JSP, ASP.NET, ASP, CGI, CFM, ...
server-side script.
url :
"http://company.com/upload.php"
|
yes |
paramfile |
This string parameter matches to input
file HTML form field needed for upload.
Default is "uploadfile". Check out
server-side script to know if you need
to modify this parameter.
paramfile
: "uploadfile"
|
yes |
folderdepth |
This integer parameter allows to set a
maximum depth for directories and
subdirectories uploads. 0 means to not
recurse subdirectories. Default is -1
(unlimited recursion).
folderdepth
: 3
|
no |
maxsize |
This parameter allows to limit total
upload size (in bytes). For instance, to
avoid end-user to send more than 100MB
file, use maxsize=1048576*100. Default
maxsize is -1. It means unlimited upload
size. Note that 1MB=1024*1024=1048576
bytes.
maxsize :
1048576 * 100
|
no |
maxfiles |
This integer parameter allows to limit
the total number of files to upload.
Default maxfiles is -1 which means
unlimited files.
maxfiles :
1000
|
no |
maxfilesize |
This integer parameter allows to limit
size of each file. For instance to avoid
end-user to upload a file larger than
5MB, use maxfilesize=1048576*5. Default
is -1 which means unlimited.
maxfilesize
: 1048576 * 5
|
no |
acceptfilter |
This string parameter allows to add a
filename filter in "Select File(s)"
prompt. Default is no filtering.
acceptfilter
: "video/*,image/*,.doc,.docx,.pdf"
|
no |
whitelist |
This string parameter allows filtering
any incoming file based on a regular
expression pattern. Any file NOT
matching to the pattern will be denied.
Here are some examples:
//
Allow files with specific extensions
only
whitelist :
"\\.(gif|jpg|jpeg|png|pdf|doc|docx)$"
// Allow files
starting with doc_
whitelist : "^(doc_)"
|
no |
blacklist |
This string parameter allows filtering
any incoming file based on a regular
expression pattern. Any file
matching to the pattern will be denied.
Here are some examples:
//
Forbid files with specific
extensions
blacklist : "\\.(exe|mp3|avi)$"
// Forbid
files with non alphanumeric, dot,
dash
blacklist : "[^a-zA-Z0-9_\\.-]"
If both whitelist and blacklist are
setup, blacklist is evaluated first
followed by whitelist. Espaced character
must be preceded by \\. |
no |
template |
This string parameter allows renaming,
on-fly, any incoming file based on a regular
expression pattern. Any character
in filename not matching to the pattern
will be replaced by "templatereplace"
parameter (which is blank by default).
//
Only alphanumeric, underscore, dash
filename
template : "[^a-zA-Z0-9_\\.-]"
This parameter applies to filename only
(not to folder path for directories
upload). Espaced character must be
preceded by \\. |
no |
templatereplace |
This string parameter allows replacing
non matching characters from "template"
parameter by another pattern. Default is
blank.
//
Replace by _
templatereplace : "_"
|
no |
template2 |
This string parameter allows renaming,
on-fly, output of previous template
result based on another regular
expression pattern.
//
One group with alphanumeric,
underscore, dash
template2 : "([a-zA-Z0-9_\\.-]+)"
|
no |
templatereplace2 |
This string parameter allows replacing
matching pattern from "template2"
parameter by another pattern. Default is
blank.
//
Append MyPrefix_ to cleaned filename
templatereplace2 : "MyPrefix_$1"
|
no |
policy |
This string parameter allows to modify
behavior when a file to upload does not
fit to "maxfilesize" requirement.
Default value is "abort", it means that
upload won't proceed and file size
requirement error will be reported.
"ignore" value means upload will proceed
and unmatching files will be skipped.
Warning will still be reported.
policy :
"ignore"
|
no |
overwritepolicy |
This string parameter allows to define
behavior when file to upload already
exists remotely. It compares remote and
local file based on filename and
filesize. Values can be "overwrite",
"skip", "abort" and "prompt". "prompt"
displays a pop-up that warns end-user
about file overwrite and allows
overwrite/skip/abort current transfer.
Default is blank which means no prompt
and always overwrite.
overwritepolicy
: "prompt"
|
no |
resume |
This boolean parameter allows to
enable resume of broken uploads. Values
could be true or false. Default is
false. An upload is considered broken if
remote file already exists and remote
file size < local file size.
resume :
true
|
no |
chunksize |
This integer parameter allows to split
file in chunks on-fly while uploading.
It is required for more than 2GB
uploads. Default is -1, it means to not
split file to upload. Server-side script
that processes upload will recompose
file from each chunk. For instance, for
100MB chunks:
chunksize
: 1048576 * 100
|
no |
retry |
This integer parameter allows to retry
current transfer when it fails for any
reason (bad networks, connection
timeout, temporary server failure, ...).
Default is 5 retry attempts.
retry : 5
|
no |
retrydelay |
This integer parameter allows to setup
delay in seconds between each retry
attempts. Default is 2 seconds.
retrydelay
: 2
|
no |
username |
This string parameter allows to pass
HTTP Basic authentication username.
username :
"myLogin"
|
no |
password |
This string parameter allows to pass
HTTP Basic authentication password.
Notice that there is no secure way to
pass such credentials in JavaScript.
You can encode or encrypt the string
with your custom code to hide it but
any advanced developer will be able to
catch it. You should have both HTML
page with file uploader and upload
script in a secure path to avoid this
situation.
//
Plain password
password : "myPassword"
// Encoded
password
password : atob("base64Password")
// Encrypted
password
password :
customDecrypt("encryptedPassword")
|
no |
forward |
This string parameter allows to
redirect to another URL once upload is
completed. You can select the target
frame through forwardtarget parameter
(see below).
forward :
"http://server.com/redirect.php"
|
no |
forwardtarget |
When forward parameter is enabled,
this string parameter allows to redirect
URL to a given browser frame. Use _blank
for new window.
forwardtarget
: "myframe"
|
no |
forwardparameters |
When this string parameter is set,
filenames upload are appended to
redirect URL. For instance,
"?filename1=foo1.txt&filename2=foo2.zip
...". Values can be "true" or "long" to
get relative paths and not just
filenames.
forwardparameters
: "long"
|
no |
post |
This string parameter allows to send
HTTP POST request once upload is
completed.
post :
"http://server.com/process.php"
|
no |
postparameters |
This string parameter allows to pass
filenames uploaded in POST request. Same
as forwardparameters but for post.
postparameters
: "true"
|
no |
resetprogressbar |
This boolean parameter allows to reset
progress bar when transfer is completed.
resetprogressbar
: true
|
no |
addons |
This string array parameter allows to
enable one or more optional add-ons.
addons:
["s3upload"]
|
no |
loglevel |
This integer parameter allows to
enable logs in JavaScript browser
console. Default is 0 (no logs). Values
can be 1, 2, or 3. Last one is quote
verbose and could slow down
performances.
loglevel :
1
|
no |
|
Extra parameter is defined by a pair paramX:
paramname, valueX: value (with X in [1,24]). A few
extra parameters below are reserved:
Extra
parameters |
Description and
example |
Mandatory |
todo |
This parameter is expected by our
server-side scripts to handle upload
requests. For instance:
param1 :
"todo",
value1 : "upload"
|
yes |
relativefilename |
When this parameter is set to true,
relative path of each file to upload is
passed in with filename. For instance,
when you upload all files and subfolders
from c:\tmp\ then the file foo.txt under
c:\tmp\sub1\sub2\foo.txt will be
uploaded with and additional
relativefilename HTTP parameter whose
value is sub1\sub2. This parameter is
useful to allow server-side script to
create folders and subfolders structure
when uploading directories and
subdirectories. Default value is
"false".
param2 :
"relativefilename",
value2 : "true"
|
no |
encodeheaders |
This parameter allows
enabling HTTP header encoding to support
non-ASCII headers content (e.g. cyrillic
filename). It requires server-side
script ready to handle/decode encoded
header. Default value is false.
param3 :
"encodeheaders",
value3 : "true"
|
no
(but should
be
enabled)
|
emptydirectory |
This parameter allows to
transfer empty directories. It is needed
when extract local directories structure
needs to be rebuilt on server-side.
param4 :
"emptydirectory",
value4 : "true"
|
no |
httpmethod |
This parameter allows to
select which HTTP verb will be used for
upload. It can be either "post" or
"put". Default is "post". "put" can be
used when a web server is configured to
limit POST upload.
param5 :
"httpmethod",
value5 : "put"
|
no |
headextraparameters |
This parameter allows to
pass all extra parameters in HEAD
requests sent by uploader (in addition
to PUT of POST requests).
param6 :
"headextraparameters",
value6 : "true"
|
no |
account |
This parameter allows to
make server-side script uses a remote
top subfolder when storing uploaded
files.
param7 :
"account",
value7 : "subfolder1"
|
no |
accountcreation |
This parameters allows to
make server-side script creates a remote
top subfolder (see above) if not exists.
param8 :
"accountcreation",
value8 : "true"
|
|
filetimestamp |
This parameter allows to
pass file last modified timestamp as
HTTP header.
param9 :
"filetimestamp",
value9 : "true"
|
no |
errorheader |
This parameter allows to
pass custom error message, in HTTP
header, from upload script to frond-end.
It helps to report with some customized
error messages setup by server-side.
param10 :
"errorheader",
value10 : "custommessage"
|
no |
|
HTML and JavaScript
declaration example |
Hereafter the code you need to
copy/paste in your HTML source to use file uploader.
"jfucontainer" DIV is the place where the uploader
will be displayed. You can include it anywhere in your
HTML page.
<html>
<head>
<meta charset="UTF-8"/>
<link type="text/css"
rel="stylesheet" href="css/style.css"
/>
<link rel="prefetch" href="img/icons.png"/>
</head>
<body>
<div
id="jfucontainer" style="width:500px;">
<!-- UI will
be inserted here automatically -->
</div>
<br/>
<script type="text/javascript"
src="js/fileupload.min.js"></script>
<!-- Start your
code here -->
<script>
// Setup some
parameters
var params
= {
/* Regular
parameters */
url :
"http://yourserver.com/upload/process.php",
paramfile : "uploadfile",
maxfilesize : 1048576 *
500,
maxfiles : 50,
maxsize : 1048576 * 1000,
chunksize : 1048576 * 50,
resume : true,
retry : 5,
retrydelay : 2,
folderdepth : -1,
resetprogressbar : true,
policy : "ignore",
overwritepolicy :
"prompt",
/* Extra
parameters */
param1 : "todo",
value1 : "upload",
param2 :
"relativefilename",
value2 : "true",
param3 : "emptydirectory",
value3 : "true",
param4 : "encodeheaders",
value4 : "false",
loglevel : 1
};
// Create your
instance of JFileUpload.
//
"jfucontainer" is DIV identifier where you
want it to be displayed.
var jfu
= new JFU("jfucontainer", params);
// Initialize
if (jfu.allFeaturesSupport() === true)
{
// Display
now
jfu.initialize();
}
else {
// Browser
not supported
var jfucontainer =
document.getElementById("jfucontainer");
jfucontainer.innerHTML =
"<h2>Browser not supported</h2>";
}
</script>
<!-- End
your code here -->
<br/>
</body>
</html>
|
|