Als u bestanden wilt uploaden naar een server, roept u eerst de methode
browse()
aan, waarmee de gebruiker een of meer bestanden kan selecteren. Wanneer vervolgens de methode
FileReference.upload()
wordt aangeroepen, wordt het geselecteerde bestand overgebracht naar de server. Als de gebruiker meerdere bestanden selecteert met de methode
FileReferenceList.browse()
, maakt Flash Player een array met de geselecteerde bestanden, met de naam
FileReferenceList.fileList
. U kunt vervolgens elk bestand afzonderlijk uploaden met de methode
FileReference.upload()
.
Opmerking:
Met de methode
FileReference.browse()
kan slechts één bestand worden geüpload. Als u wilt dat de gebruiker meerdere bestanden kan uploaden, moet u de methode
FileReferenceList.browse()
gebruiken.
In het dialoogvenster met de bestandskiezer van het besturingssysteem kunnen gebruikers standaard elk bestandstype op de lokale computer selecteren. Ontwikkelaars kunnen een of meer aangepaste bestandstypefilters opgeven door de klasse FileFilter te gebruiken en een array met bestandsfilterinstanties door te geven aan de methode
browse()
:
var imageTypes:FileFilter = new FileFilter("Images (*.jpg, *.jpeg, *.gif, *.png)", "*.jpg; *.jpeg; *.gif; *.png");
var textTypes:FileFilter = new FileFilter("Text Files (*.txt, *.rtf)", "*.txt; *.rtf");
var allTypes:Array = new Array(imageTypes, textTypes);
var fileRef:FileReference = new FileReference();
fileRef.browse(allTypes);
Nadat de gebruiker de bestanden heeft geselecteerd en op de knop Openen in de bestandskiezer heeft geklikt, wordt de gebeurtenis
Event.SELECT
verzonden. Als de methode
FileReference.browse()
wordt gebruikt om een bestand voor het uploaden te selecteren, wordt het bestand door de volgende code naar een webserver verzonden:
var fileRef:FileReference = new FileReference();
fileRef.addEventListener(Event.SELECT, selectHandler);
fileRef.addEventListener(Event.COMPLETE, completeHandler);
try
{
var success:Boolean = fileRef.browse();
}
catch (error:Error)
{
trace("Unable to browse for files.");
}
function selectHandler(event:Event):void
{
var request:URLRequest = new URLRequest("http://www.[yourdomain].com/fileUploadScript.cfm")
try
{
fileRef.upload(request);
}
catch (error:Error)
{
trace("Unable to upload file.");
}
}
function completeHandler(event:Event):void
{
trace("uploaded");
}
U kunt gegevens naar de server verzenden met de methode
FileReference.upload()
door gebruik te maken van de eigenschappen
URLRequest.method
en
URLRequest.data
om variabelen te verzenden met de methode
POST
of
GET
.
Wanneer u probeert om een bestand te laden met de
FileReference.upload()
-methode, worden de volgende gebeurtenissen verzonden:
-
open
-gebeurtenis (
Event.OPEN
): Wordt verzonden wanneer de laadbewerking start.
-
progress
-gebeurtenis (
ProgressEvent.PROGRESS
): Wordt regelmatig verzonden naarmate gegevensbytes uit het bestand worden geladen.
-
complete
-gebeurtenis (
Event.COMPLETE
): Wordt verzonden wanneer de laadbewerking met succes is voltooid.
-
httpStatus
-gebeurtenis (
HTTPStatusEvent.HTTP_STATUS
): Wordt verzonden wanneer het laadproces mislukt door een HTTP-fout.
-
httpResponseStatus
-gebeurtenis (
HTTPStatusEvent.HTTP_RESPONSE_STATUS
): Wordt verzonden als een aanroep van de methode
upload()
of
uploadUnencoded()
via HTTP toegang tot gegevens probeert te krijgen, en Adobe AIR de statuscode voor de aanvraag kan detecteren en retourneren.
-
securityError
-gebeurtenis (
SecurityErrorEvent.SECURITY_ERROR
Verzonden wanneer een oplaadactie mislukt als gevolg van een schending van de beveiliging.
-
uploadCompleteData
-gebeurtenis (
DataEvent.UPLOAD_COMPLETE_DATA
): Wordt verzonden nadat gegevens van de server zijn ontvangen nadat het uploaden is voltooid.
-
ioError
-gebeurtenis (
IOErrorEvent.IO_ERROR
): Wordt verzonden als het uploadproces mislukt door een van de volgende oorzaken:
-
Er is een invoer-/uitvoerfout opgetreden terwijl Flash Player het bestand las, schreef of verzond.
-
Het SWF-bestand probeert een bestand te uploaden dat verificatie vereist (zoals een gebruikersnaam en een wachtwoord). Tijdens het uploaden biedt Flash Player gebruikers niet de mogelijkheid een wachtwoord in te voeren.
-
De parameter
url
bevat een ongeldig protocol. De methode
FileReference.upload()
moet HTTP of HTTPS gebruiken.
Flash Player biedt geen volledige ondersteuning van servers die verificatie vereisen. Alleen SWF-bestanden die in een browser worden uitgevoerd, waarbij de browserinsteekmodule of het Microsoft ActiveX®-besturingselement wordt gebruikt, kunnen een dialoogvenster weergeven waarin de gebruiker wordt gevraagd een gebruikersnaam en wachtwoord ter verificatie in te voeren. Bovendien is dit alleen mogelijk voor downloads. Bij uploaden met behulp van de insteekmodule of het ActiveX-besturingselement, of bij uploaden/downloaden met een zelfstandige of externe speler, mislukt de bestandsoverdracht.
Als u in ColdFusion een serverscript maakt dat een bestandsupload van Flash Player accepteert, kunt u code gebruiken zoals hier beschreven:
<cffile action="upload" filefield="Filedata" destination="#ExpandPath('./')#" nameconflict="OVERWRITE" />
Deze ColdFusion-code uploadt het bestand dat door Flash Player is verzonden en slaat het op in dezelfde map als de ColdFusion-sjabloon. Als er een bestand met dezelfde naam aanwezig is, wordt dit overschreven. De voorgaande code bevat de minimale code die nodig is om een bestandsupload te accepteren. Dit script moet niet worden gebruikt in een productie-omgeving. U kunt het beste gegevensvalidatie toevoegen zodat gebruikers alleen geaccepteerde bestandstypen kunnen uploaden, zoals een afbeelding in plaats van een potentieel gevaarlijk serverscript.
De volgende code bevat een voorbeeld van een bestandsupload met PHP en bevat gegevensvalidatie. Het script beperkt het aantal geüploade bestanden in de uploadmap tot 10, controleert of het bestand kleiner is dan 200 kB en staat alleen toe dat JPEG-, GIF- of PNG-bestanden worden geüpload naar en opgeslagen op het bestandssysteem.
<?php
$MAXIMUM_FILESIZE = 1024 * 200; // 200KB
$MAXIMUM_FILE_COUNT = 10; // keep maximum 10 files on server
echo exif_imagetype($_FILES['Filedata']);
if ($_FILES['Filedata']['size'] <= $MAXIMUM_FILESIZE)
{
move_uploaded_file($_FILES['Filedata']['tmp_name'], "./temporary/".$_FILES['Filedata']['name']);
$type = exif_imagetype("./temporary/".$_FILES['Filedata']['name']);
if ($type == 1 || $type == 2 || $type == 3)
{
rename("./temporary/".$_FILES['Filedata']['name'], "./images/".$_FILES['Filedata']['name']);
}
else
{
unlink("./temporary/".$_FILES['Filedata']['name']);
}
}
$directory = opendir('./images/');
$files = array();
while ($file = readdir($directory))
{
array_push($files, array('./images/'.$file, filectime('./images/'.$file)));
}
usort($files, sorter);
if (count($files) > $MAXIMUM_FILE_COUNT)
{
$files_to_delete = array_splice($files, 0, count($files) - $MAXIMUM_FILE_COUNT);
for ($i = 0; $i < count($files_to_delete); $i++)
{
unlink($files_to_delete[$i][0]);
}
}
print_r($files);
closedir($directory);
function sorter($a, $b)
{
if ($a[1] == $b[1])
{
return 0;
}
else
{
return ($a[1] < $b[1]) ? -1 : 1;
}
}
?>
U kunt aanvullende variabelen doorgeven aan het uploadscript met de aanvraagmethode
POST
of
GET
. Als u aanvullende
POST
-variabelen naar het uploadscript wilt verzenden, kunt u de volgende code gebruiken:
var fileRef:FileReference = new FileReference();
fileRef.addEventListener(Event.SELECT, selectHandler);
fileRef.addEventListener(Event.COMPLETE, completeHandler);
fileRef.browse();
function selectHandler(event:Event):void
{
var params:URLVariables = new URLVariables();
params.date = new Date();
params.ssid = "94103-1394-2345";
var request:URLRequest = new URLRequest("http://www.yourdomain.com/FileReferenceUpload/fileupload.cfm");
request.method = URLRequestMethod.POST;
request.data = params;
fileRef.upload(request, "Custom1");
}
function completeHandler(event:Event):void
{
trace("uploaded");
}
In het voorgaande voorbeeld wordt een URLVariables-object gemaakt dat u doorgeeft aan het externe serverscript. In vorige versies van ActionScript kon u variabelen doorgeven aan het serveruploadscript door waarden door te geven in de queryreeks. In ActionScript 3.0 kunt u variabelen aan het externe script doorgeven met een object URLRequest, zodat u gegevens kunt doorgeven met de methode
POST
of
GET
. Hiermee kunnen grotere hoeveelheden gegevens gemakkelijker worden doorgegeven. Als u wilt opgeven of de variabelen worden doorgegeven met de aanvraagmethode
GET
of
POST
, stelt u de eigenschap
URLRequest.method
in op respectievelijk
URLRequestMethod.GET
of
URLRequestMethod.POST
.
In ActionScript 3.0 kunt u de standaardveldnaam voor uploadbestanden
Filedata
overschrijven door een tweede parameter door te geven aan de methode
upload()
, zoals in het volgende voorbeeld wordt getoond (waarin de standaardwaarde
Filedata
wordt vervangen door
Custom1
).
De Flash Player probeert standaard geen testupload te verzenden, hoewel u deze standaard kan negeren door een waarde van
true
te passeren als de derde parameter van de
upload()
-methode. Het doel van de testupload is te controleren of de daadwerkelijke bestandsupload en de serververificatie, indien vereist, zal slagen.
Opmerking:
Momenteel vindt een testupload alleen plaats in Flash Player voor Windows.
Het serverscript dat de bestandsupload afhandelt, moet een HTTP
POST
-aanvraag verwachten met de volgende elementen:
-
Content-Type
met de waarde
multipart/form-data.
-
Content-Disposition
waarbij het kenmerk
name
is ingesteld op "
Filedata
" en het kenmerk
filename
is ingesteld op de naam van het oorspronkelijke bestand U kunt een aangepast kenmerk
name
opgeven door een waarde voor de parameter
uploadDataFieldName
door te geven in de methode
FileReference.upload()
.
-
De binaire inhoud van het bestand.
Hier volgt een voorbeeld van een HTTP
POST
-aanvraag:
POST /handler.asp HTTP/1.1
Accept: text/*
Content-Type: multipart/form-data;
boundary=----------Ij5ae0ae0KM7GI3KM7ei4cH2ei4gL6
User-Agent: Shockwave Flash
Host: www.mydomain.com
Content-Length: 421
Connection: Keep-Alive
Cache-Control: no-cache
------------Ij5ae0ae0KM7GI3KM7ei4cH2ei4gL6
Content-Disposition: form-data; name="Filename"
sushi.jpg
------------Ij5ae0ae0KM7GI3KM7ei4cH2ei4gL6
Content-Disposition: form-data; name="Filedata"; filename="sushi.jpg"
Content-Type: application/octet-stream
Test File
------------Ij5ae0ae0KM7GI3KM7ei4cH2ei4gL6
Content-Disposition: form-data; name="Upload"
Submit Query
------------Ij5ae0ae0KM7GI3KM7ei4cH2ei4gL6
(actual file data,,,)
Met het volgende voorbeeld van een HTTP
POST
-aanvraag worden drie
POST
-variabelen verzonden:
api_sig
,
api_key
en
auth_token
, en wordt de aangepaste veldnaamwaarde voor uploadgegevens
"foto"
gebruikt:
POST /handler.asp HTTP/1.1
Accept: text/*
Content-Type: multipart/form-data;
boundary=----------Ij5ae0ae0KM7GI3KM7ei4cH2ei4gL6
User-Agent: Shockwave Flash
Host: www.mydomain.com
Content-Length: 421
Connection: Keep-Alive
Cache-Control: no-cache
------------Ij5GI3GI3ei4GI3ei4KM7GI3KM7KM7
Content-Disposition: form-data; name="Filename"
sushi.jpg
------------Ij5GI3GI3ei4GI3ei4KM7GI3KM7KM7
Content-Disposition: form-data; name="api_sig"
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
------------Ij5GI3GI3ei4GI3ei4KM7GI3KM7KM7
Content-Disposition: form-data; name="api_key"
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
------------Ij5GI3GI3ei4GI3ei4KM7GI3KM7KM7
Content-Disposition: form-data; name="auth_token"
XXXXXXXXXXXXXXXXXXXXXXX
------------Ij5GI3GI3ei4GI3ei4KM7GI3KM7KM7
Content-Disposition: form-data; name="photo"; filename="sushi.jpg"
Content-Type: application/octet-stream
(actual file data,,,)
------------Ij5GI3GI3ei4GI3ei4KM7GI3KM7KM7
Content-Disposition: form-data; name="Upload"
Submit Query
------------Ij5GI3GI3ei4GI3ei4KM7GI3KM7KM7--