Nwlapcug.com


Come caricare i file usando Ajax & PHP



Quando viene caricato un file a un sito Web utilizzando PHP e HTML, la pagina Web non è possibile aggiornare fino a quando il caricamento è completato. Questo potrebbe richiedere molto tempo, specialmente se è un file di grandi dimensioni. Uno sviluppatore Web può evitare questo problema utilizzando tecniche AJAX (Asynchronous JavaScript and XML) per consentire all'utente di continuare a utilizzare la pagina Web mentre è in corso il caricamento del file.

Istruzioni

Caricamento asincrono

1

Creare un documento di testo vuoto sul desktop del computer e rinominarlo "filesave.php." Copiare e incollare il codice riportato di seguito in "filesave.php" e poi selezionare "file | Salva". Questo script PHP riceverà il file da un invio di form HTML e salvarlo nella directory corrente sul server Web.

<? php

$upload_result = 0;

$target_folder = ". /";

$target_path = $target_folder.basename ($_FILES['uploadfile']['name']);

Se (@move_uploaded_file ($ Files ['uploadfile'] ['tmp_name'], $target_path)) {

$upload_result = 1;

}

? >

2

Creare un documento di testo vuoto sul desktop del computer e rinominarlo "fileupload.html." Aprire "fileupload.html" in blocco note e copiare e incollare il codice seguente. Modificare "yoursite.com" per il dominio del tuo sito Web. Questo codice utilizza la tecnica asincrona di "inclusione" la risposta di filesave.php dentro l'iframe "iframe_target," affinché il sito Web non è necessario aggiornare.

< html >

< head >

< / head >

< corpo >

< div id = "upload_status" >< / div >

< forma azione = "http://www.yoursite.com/filesave.php" method = "post" enctype = "multipart/form-data" target = 'iframe_target' >

Si prega di inserire un nome di file:

< nome input = "uploadfile" type = "file" / >

< input type = "submit" value = "Upload" / >

< / form >

< iframe id = "upload_target" name = "iframe_target" style = "width: 0; altezza: 0" >< / iframe >

< / body >

< / html >

3

Caricare "filesave.php" e "fileupload.php" nella directory principale del tuo sito Web, utilizzando FTP software.

4

Aprite il vostro browser a "http://www.yoursite.com/fileupload.html" dove "yoursite.com" è il nome di dominio del sito Web. Fare clic su "Sfoglia..." e selezionare un file di grandi dimensioni ad esempio un file di immagine di esempio e quindi fare clic su "carica." Il caricamento verrà completata quando il browser Visualizza il "Fatto" nella parte inferiore della finestra. Verificare che il file è stato caricato correttamente, utilizzando il software FTP.

Utilizzo di DOM (Document Object Model) per visualizzare un messaggio di stato

5

Copiare e incollare il seguente codice sopra il tag di fine "< / head >" in "fileupload.html" sul tuo desktop. La funzione di "begin_upload" utilizza l'elemento documento "upload_status" per visualizzare il messaggio "caricamento...". La funzione di "end_upload" si chiamerà dalla risposta PHP dopo che è salvato correttamente il file caricato.

< script >

Function begin_upload() () {

document.getElementById('upload_status').innerHTML = 'caricamento in corso...';

Restituisce true;

}

Function end_upload(result) () {

if (result == 1){

document.getElementById('upload_status').innerHTML ="The file was successfully uploaded.";

} else {

document.getElementById('upload_status').innerHTML = "An error occurred during upload.";

}

return true;

}

< / script >

6

Inserire la stringa "onSubmit='begin_upload();'" dopo la stringa "destinazione = 'iframe_target'" interno "l'azione del modulo" tag, in modo che l'intero tag appare come sotto. In questo modo la funzione di "begin_upload()" per essere chiamato quando l'utente fa clic sul pulsante "upload". Selezionare "file | Salva".

< forma azione = "http://www.yoursite.com/filesave.php" method = "post" enctype = "multipart/form-data" target = 'iframe_target' onSubmit='begin_upload();' >

7

Premere "Alt + TAB" per selezionare "filesave.php" nel blocco note. Copiare e incollare le due righe seguenti nella parte superiore prima il "<? php" linea, in modo che lo script PHP utilizza una funzione di script JavaScript chiamata "init ()."

< script type = "text/javascript" >

Function init () {

8

Copiare e incollare le seguenti righe sotto la linea di fondo "? >," affinché lo script PHP restituisce il valore del risultato di file salvati nella funzione "init ()". Selezionare "file | Salva".

Top.end_upload (<? php echo $upload_result;? >);

}

Window.OnLoad=init;

< / script >

9

Caricare "filesave.php" e "fileupload.html" al tuo sito Web, sovrascrivendo le versioni precedenti.

10

Aprite il vostro browser a "http://www.yoursite.com/fileupload.html" dove "yoursite.com" è il nome di dominio del sito Web. Fare clic su "Sfoglia..." e selezionare un file di grandi dimensioni e quindi fare clic su "carica." Ora verrà visualizzato il messaggio "caricamento..." durante il caricamento, e al termine, verrà visualizzato il messaggio "successfully uploaded".