Vue Js Upload
Vue Js Upload
BELT
… OnlyKiosk Coding …
enctype=“multipart/form-data”
OnlyKiosk.com
GLOBAL ARRAY $_FILES
1. After you have uploaded a file, the file will first be stored in a temporary
file folder and will be given a temporary name.
2. PHP will then acquire a global multidimensional array $_FILES.
3. The array key will be the name you picked for the input tag( type= file).
$_FILES[‘upload’][‘…’]
OnlyKiosk.com
$_FILES[‘upload’] carries
important information
about the uploaded file.
OnlyKiosk.com
1. $_FILES[‘upload’][‘name’]
The original name of the uploaded file.
2. $_FILES[‘upload’][‘type’]
The file type of the uploaded file.
3. $_FILES[‘upload’][‘size’]
The size of the already uploaded part of the file.
4. $_FILES[‘upload’][‘tmp_name’]
The temporary file name used at the server side.
5. $_FILES[‘upload’][‘error’]
0 means upload successful
OnlyKiosk.com
$_FILES[‘upload’][‘tmp_name’]
new URL + new name or $_FILES[‘upload_file’][‘name’]
OnlyKiosk.com
Now, you can do
upload, but this
is NOT enough.
OnlyKiosk.com
1. Uploaded files must pass security check;
2.Uploaded files must be stored in order;
3.Uploaded files must be named properly;
OnlyKiosk.com
1.control file size;
2.control file type;
3.change file name and URL;
OnlyKiosk.com
1.control file size;
OnlyKiosk.com
Two places you can control the file size:
1.Server side;
2.Browser side;
OnlyKiosk.com
bytes
OnlyKiosk.com
Ctrl+F
OnlyKiosk.com
OnlyKiosk.com
$_FILES[‘upload][‘error’]
$_FILES[‘upload’][‘error’] Description
0 Upload Successful
1 file size > upload_max_filesize in php.ini
3 Partly uploaded
OnlyKiosk.com
2. control file type;
OnlyKiosk.com
2. Check file type:
OnlyKiosk.com
3. Change file name and URL:
OnlyKiosk.com
3. Rename the file:
OnlyKiosk.com
Get the file name extension
OnlyKiosk.com
Inside the same directory, you need to make sure every file name is unique.
OnlyKiosk.com
time().”file_name_extension”
OnlyKiosk.com
Inside the same directory, you need to make sure every file name is unique.
time().rand(1000,9999).$file_name_extension
OnlyKiosk.com
time().rand(1000,9999).”file_name_extension”
OnlyKiosk.com
Store in good order.
OnlyKiosk.com
1. Rename the uploaded file;
2. Make new directories( mkdir() );
Using date(), time() and rand() to name directories and files is a very good solution
./2015/06/23/14350590831984.jpg
./date(“Y”)/date(“m”)/date(“d”)/time().rand(1000,9999).jpg
There are many ways to name a directory
OnlyKiosk.com
“Y” “m” ”d”
./2015/06/23/
mkdir(“./”.date(“Y”).”/”.date(‘m’).”/”. date(‘d’),0777,True);
$recursive controls whether you can create multiple directories in one try.
OnlyKiosk.com
Check first if the directory already exists
OnlyKiosk.com
collect files
<form></form> <input/>
security check
limit max file size control acceptable file type
storage
change file name mkdir()
OnlyKiosk.com
OnlyKiosk.com
OnlyKiosk.com
cooperation among fopen(), fread(),
fclose() and the browser, you use
header() to communicate with
the browser.
OnlyKiosk.com
1. header("Content-type: application/octet-stream");
tell the browser to download the file, not to open the file directly
2. header("Accept-Ranges: bytes");
what partial content range types this server supports
3. header("Accept-Length:".filesize($file_path));
the size of the file to be downloaded
4. header("Content-Disposition: attachment; filename=".$file_name);
the name you want the downloaded file to have
( You do not need to memorize the four argument values, just copy and paste.
But make sure you provide the right file size and file name.)
OnlyKiosk.com
$handle=fopen($filepath, ”r”);
while(!feof($handle)){
echo fread($handle,1024);
}
fclose($handle);
OnlyKiosk.com
header("Content-type: application/octet-stream");
header("Accept-Ranges: bytes");
header("Accept-Length:".filesize($filepath));
header("Content-Disposition: attachment; filename=".$file_name);
$handle=fopen($filepath, ”r”);
while(!feof($handle)){
echo fread($handle,1024);
}
fclose($handle);
OnlyKiosk.com
uploading is dangerous,
downloading is also dangerous;
OnlyKiosk.com
1. controls which file will be downloaded;
$filepath 2. therefore, its value must be filtered and limited.
OnlyKiosk.com
GET Method
1.When sending values using the GET method, always
remember: everyone can see what you have sent;
2.everyone can also change what you sent using $_GET;
3.Never trust values sent by the GET method;
4.Always compare the value sent by the GET method
against an acceptable value range before using that
value.
OnlyKiosk.com
there are many ways to protect the download program
design 1:
1.we use an array to hold the names of all the downloadable
files;
2.then, we compare the $_GET[‘pic_name’] to the array element;
3.if no match found, we shut down program;
4.using array to hold names of the downloadable files, we can
manage those files easily and more efficiently;
OnlyKiosk.com
OnlyKiosk.com
Here comes the problem:
If we have a million pictures on our
server, how do we manage them?
OnlyKiosk.com
it’s impossible to remember
the URL of every file
OnlyKiosk.com
OnlyKiosk.com
OnlyKiosk.com
OnlyKiosk.com
OnlyKiosk.com
1. At the destination file, there is still a global array that
can work as a receiver.
2. It’s a multidimensional array called $_FILES[‘upload’];
3. But the difference is $_FILES[‘upload’] only receives
the basic information of the uploaded file;
OnlyKiosk.com
Inside the same directory,
two files CANNOT have
the same name.
OnlyKiosk.com