Tecnologias web e linguagens de programação web: html, css, php, javascript, ajax, java, jsp, asp...

segunda-feira, 4 de novembro de 2013

Upload em PHP - Tutorial completo. parte 1



Neste artigo irei mostrar como fazer upload de arquivos para o servidor. Para começar irei considerar que já tenha instalado um servidor Web que suporte PHP.
Crie um novo site no teu servidor com o nome upload e crie um arquivo índex.php e crie um directório com o nome files (por segurança deixe sempre o directório que ira receber os uploads fora do domínio do teu site, e que não seja acessível via url, mas sempre com privilegio de leitura e escrita).

Vamos agora preparar o formulário para upload. Adicione no arquivo índex.php o seguinte código:
<?php

?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/xhtml1-strict.dtd">
<html >

    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>jQuery</title>
        <style>
            h2{
                text-align:center;
                color: #1A5018;
            }



        </style>
    </head>
    <body>
        <h2>Upload de Ficheiros</h2>
<center>
            <fieldset>
                <legend align="center">Upload a File to a server</legend>
                <form action="" method="post" enctype="multipart/form-data" name="uploadImage" id="uploadImage">
                    <p>
                        <h4>
                            <?php
                            if(isset($mensagem)){
                                echo $mensagem;
                            }
                            ?>
                        </h4>
                    </p>
                    <p><img src="<?php echo './uploads/'. $fileName; ?>" width="200px" height="200px" style="position: relative"/></p>
                    <p>
                        <label for="image">Upload image:</label>                        
                        <input type="file" name="image" id="image" />

                    </p>
                    <p>
                        <input type="submit" name="upload" id="upload" value="Upload" />
                    </p>
                </form>
            </fieldset>
        </center>
    </body>
</html>

Até aqui acho que não preciso explicar nada, criamos um formulário com um único campo do tipo file que é responsável por carregar arquivos (de qualquer tipo) para o directório temporário do servidor Web. E nunca se esqueça que para o formulário fazer upload é preciso adicionar o atributo enctype="multipart/form-data".

Vamos verificar se esta tudo bem com a configuracao no ficheiro php.ini do servidor Web:
max_execution_time – tempo máximo em segundos que um ficheiro deve executar ate disparar erro fatal.

max_input_time – tempo máximo em segundos para carregar todos arrays $_get, $_post e todos ficheiros upload

post_max_size – tamanho máximo de dados $_post carregados do formulario, incluindo uploads

upload_tmp_dir – nome da pasta que guarda arquivos temporaries (caminho absoluto)

upload_max_filesize – tamanho máximo do ficheiro ao fazer upload

Vamos agora entender um pouco sobre a variável SUPERGLOBAL $_FILES.
$_FILES é um arrey superglobal que contem a informação de todos os arquivos carregados, suponhamos que em vez de um campo temos dois para upload de dois arquivos em simultâneo (image e image1), ao submeter o formulário, os dois arquivos ficarão na variável $files.
Para testar isso coloque entre as tags <?php  ?> o seguinte código:
if (array_key_exists('upload', $_POST)) {
echo ‘<pre>’;
print_r($_FILES);
echo’</pre>’;
}

Ao testar teremos como resultado dois arrays (ou um array files com dois subarrays) com nomes dos campos input files:
Array
(
    [image] => Array
        (
            [name] => ArtColide_by_alivepixel.png
            [type] => image/png
            [tmp_name] => C:\xampp\tmp\phpF2F.tmp
            [error] => 0
            [size] => 136218
        )

    [image1] => Array
        (
            [name] => breeze_manager.gif
            [type] => image/gif
            [tmp_name] => C:\xampp\tmp\phpF4F.tmp
            [error] => 0
            [size] => 52154
        )

)

[image] ou [image1] é o nome do campo(s).
[name] – nome real do ficheiro carregado
[type] – tipo do ficheiro carregado. Veja abaixo os tipos de ficheiro em php
Tipo
Descrição
application/msword
Microsoft Word document
application/pdf
PDF document
text/plain
Plain text
text/rtf
Rich text format
image/gif
GIF format
image/jpeg
JPEG format (includes .jpg files)
image/pjpeg
JPEG format (nonstandard MIME type used
by Internet Explorer)
image/png
PNG format
image/tiff
TIFF format


[tmp-name] – nome do arquivo temporário
[error] – código de mensagem de erro, se não tiver erro será zero (0):
Códigos de erro:
0 – carregado com sucesso
1 – ficheiro excedeu o limite de tamanho especificado pelo arquivo php.ini (que geralmente é 2MB)
2 - ficheiro excedeu o limite de tamanho especificado pela funcao MAX_FILE_SIZE (veremos mais  tarde)
3 – carregado apenas uma parte do ficheiro
4 – nenhum ficheiro submetido, campo vazio
5 – ainda não definido
6 – pasta temporária inexistente
7 – impossível gravar ficheiro carregado no disco
[size] – tamanho do arquivo carregado em bytes

Ao carregar um arquivo ele fica num formato de arquivo temporário ([tmp-name]), que será posteriormente destruído.
Ok, agora vamos salvar o documento carregado na pasta uploads que criamos posteriormente. Para isso, temos que salvar o arquivo temporário [tmp-name] na nossa pasta uploads para que fique la permanentemente.
Remova todo o código php  do exemplo anterior e adicione o seguinte código, ou melhor, vou deixar todo o código do arquivo índex.php aqui:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/xhtml1-strict.dtd">
<html >

    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>upload</title>
        <style>
            h2{
                text-align:center;
                color: #1A5018;
            }
                                   
                                    .m-div
                                    {
                                    border:1px solid #ABDD6D;
                                    background-color: #CCEAA8;
                                    border-radius: 4px;
                                    padding: 10px;
                                    margin-left: 20px;
                                    width: auto;
                                    padding-right: 0;
                                    }



        </style>
    </head>
    <body>
        <h2>Upload de Ficheiros</h2>
       
      
            <?php
            if (array_key_exists('upload', $_POST)) {
                                        $path = dirname(__FILE__);
                $up_dir = $path . '/uploads/';

                $file = ($_FILES['image']['name']); //nome do arquivo original
                 $sucesso=move_uploaded_file($_FILES['image']['tmp_name'], $up_dir . $file);
                                                 if($sucesso){
                                                 $message='Arquivo carregado com sucesso';
                                                 }
                                                 else
                                                 {
                                                 $message='erro ao carregar arquivo';
                                                 }
                                                 }
              
            ?>
                                   
       <center>
            <fieldset>
                <legend align="center">Upload a File to a server</legend>
                <form action="" method="post" enctype="multipart/form-data" name="uploadImage" id="uploadImage">
                    <p>
                       
                    </p>
                    <p><img src="<?php echo './uploads/'. $fileName; ?>" width="200px" height="200px" style="position: relative"/></p>
                    <p>
                        <label for="image">Upload File:</label>                       
                        <input type="file" name="image" id="image" />
                                                              

                    </p>
                    <p>
                        <input type="submit" name="upload" id="upload" value="Upload" />
                    </p>
                </form>
            </fieldset>
                                    <?php
                                    If(isset($message)){
                                    echo'<div class="m-div">'.$message.'</div>';
                                   
                                    }
                                    ?>
        </center>
    </body>

</html>




array_key_exists('upload', $_POST) - verifica se foram submetidos dados com o metodo $_post atravez do comando upload.

a funcao move_uploaded_file($_FILES['image']['tmp_name'], $up_dir . $file) e responsavel por mover o artigo carregado a uma nova pasta, leva dois argumentos sendo o primeiro o arquivo carregado e o segundo o local e nome do arquivo a ser guardado (neste caso sera guardado com mesmo nome do ficheiro original).

$path = dirname(__FILE__); retorna o caminho absoluto do ficheiro em execucao (index.php)

 $up_dir = $path . '/uploads/'; definimos a pasta de uploads, que se encontro no mesmo arquivo que o index.php, logo teremos o caminho absoluto do site, mais a pasta uploads

 

No próximo tutorial iremos ver como gravar o arquivo carregado com um nome diferente, especificar o tipo e tamanho do arquivo, e muito mais


Pegue o projecto completo aqui



Compartilhar:
← Mensagem mais recente Mensagem antiga → Página inicial

0 comentários:

Enviar um comentário

Publicação em destaque

Adicionar Fontes Externas ao Site Usando CSS

Hoje vamos aprender uma coisa bastante simples, mas importante. Certamente já deve ter se deparado com as limitações de fontes ao criar ...

Seguidores

Total de visualizações

Com tecnologia do Blogger.

Artigos Populares

Newsletter

Subscribe Our Newsletter

Enter your email address below to subscribe to our newsletter.