10

Estou tentando enviar um arquivo via Upload para uma determinada pasta mas não estou conseguindo fazer e nem entendendo o erro que está sendo acusado pelo script, vou tentar ser o mais claro possível na descrição do problema. Esse é o trecho do formulário da validação e envio do Upload:

// INÍCIO GRAVA UPLOAD
function GravaUpload(event) {

    event.preventDefault();

    var params = $('#frmUpload').serializeArray();  
    $("#resultado-upload").html('<img src="../_imagens/ajax-loader.gif" alt="Enviando..." />');

    $.post(
        'GravaUpload.php',
        params,
        function( json, textStatus, jQxhr )
        {               
            if (json.status != "ERRO") {
                var msg = '<div class="alert alert-info" role="alert">' + json.msg + '</div>' ;
            } else {
                var msg = '<div class="alert alert-danger" role="alert">' + json.msg + '</div>' ;
            }
            $("#resultado-upload").html(msg);
        },
        'json'
    )
    .fail(function( jqXhr, textStatus, errorThrown ){

        console.log( jqXhr, textStatus, errorThrown );
        try {
            var json = $.parseJSON(jqXHR.responseText);
            var msg = '<div class="alert alert-danger" role="alert">' + json.errorMessage + '.</div>';
            $("#resultado-upload").html(msg);
        } catch(e) { 
            var msg = '<div class="alert alert-danger" role="alert">Ocorreu um erro ao tentar manipular os dados. Verifique sua conexão com o banco de dados.</div>';
            $("#resultado-upload").html(msg);
        }
    });
}  // FIM GRAVA DETALHES DO CONTRATO

$(document).ajaxError(function (e, data, settings, exception) { 
    console.log(e, data, settings, exception);
});

$(document).ready(function() {

    //***** Validações de campos e envio do formulario por AJAX
    $("#frmUpload").validate({
        rules: {
            fileUpload: {
                required: true,
            }
        },
        highlight: function(element) {
            $(element).closest('.form-group').addClass('has-error');
        },
        unhighlight: function(element) {
            $(element).closest('.form-group').removeClass('has-error');
        },
        errorElement: 'span',
        errorClass: 'help-block',
        errorPlacement: function(error, element) {
            if (element.parent('.input-group').length) {
                error.insertAfter(element.parent());
            } else {
                error.insertAfter(element);
            }
        },

        //Monta a mensagem em uma caixa separada se necessário
        //errorLabelContainer: $('#mensagens'),

        //função para enviar após a validação
        submitHandler: function(form) {
           GravaUpload(event);
        } //end-submiteHandler  
    });
});

Formulário de Envio:

<form class="well" id="frmUpload" action="" method="post" enctype="multipart/form-data">
    <div class="form-group">
        <label for="fileUpload">Selecione o Documento para Upload</label>
        <input type="file" name="fileUpload">
    </div>
    <input type="submit" class="btn btn-primary" value="Upload">
</form> 

Processo do Upload:

// Ativar relatórios de erro php
error_reporting(E_ALL);
ini_set('display_errors', 1);


if ($_SERVER['REQUEST_METHOD'] == 'POST') { 

    $name     = $_FILES['fileUpload']['name'];
    $tmpName  = $_FILES['fileUpload']['tmp_name'];
    $error    = $_FILES['fileUpload']['error'];
    $size     = $_FILES['fileUpload']['size'];
    $ext      = strtolower(pathinfo($name, PATHINFO_EXTENSION));

    switch ($error) {
        case UPLOAD_ERR_OK:
            $valid = true;
            //validate file extensions
            if ( !in_array($ext, array('jpg','jpeg','png','gif','doc','docx','pdf','xls')) ) {
                $valid = false;
                $aretorno["msg"] = 'Extensao de arquivo invalida ';
            }
            //validate file size
            if ( $size/1024/1024 > 2 ) {
                $valid = false;
                $aretorno["msg"] = 'Tamanho do arquivo e superior a tamanho maximo permitido';
            }
            //upload file
            if ($valid) {
                $targetPath =  dirname( __FILE__ ) . DIRECTORY_SEPARATOR. 'arquivos' . DIRECTORY_SEPARATOR. $name;
                move_uploaded_file($tmpName,$targetPath); 
                header( 'Location: DetalhesContrato.php' ) ;
                exit;
            }
            break;
        case UPLOAD_ERR_INI_SIZE:
            $aretorno["msg"] = 'O arquivo enviado excede a directiva upload_max_filesize em php.ini.';
            break;
        case UPLOAD_ERR_PARTIAL:
            $aretorno["msg"] = 'O arquivo foi apenas parcialmente enviado.';
            break;
        case UPLOAD_ERR_NO_FILE:
            $aretorno["msg"] = 'Nenhum arquivo foi transferido.';
            break;
        case UPLOAD_ERR_NO_TMP_DIR:
            $aretorno["msg"] = 'Faltando uma pasta temporaria. Introduzida no PHP 4.3.10 e PHP 5.0.3.';
            break;
        case UPLOAD_ERR_CANT_WRITE:
            $aretorno["msg"] = 'Falha ao gravar arquivo em disco. Introduzido no PHP 5.1.0.';
            break;
        default:
            $aretorno["msg"] = 'Erro desconhecido';
        break;
    }

    // echo $response;


    //retornando o status / mensagem da execução
    header('Content-Type: application/json');
    echo json_encode($aretorno);    

}

O upload cai na primeira exceção:

var msg = '<div class="alert alert-danger" role="alert">Ocorreu um erro ao tentar manipular os dados. Verifique sua conexão com o banco de dados.</div>';

Ainda não estou usando conexão com BD pois não estou enviando nada.

4
  • Enviando um arquivo com ajax?
    – rray
    Commented 28/07/2015 às 13:19
  • 2
    Fazer upload de arquivo com AJAX
    – rray
    Commented 28/07/2015 às 13:27
  • Vai no console do seu navegador, e verifica o erro na aba network. Fica mais facil Commented 28/07/2015 às 17:58
  • Enviar arquivo com ajax ? se você esta tentando enviar uma imagem deve usar o toDataURL() pois ajax so faz envio de dados em texto.
    – user28266
    Commented 29/07/2015 às 17:55

1 Resposta 1

5

Ele sempre cai na primeira exceção porque não é um problema com o banco de dados e sim com o try/catch.

Resolvendo o problema no front-end

try {
    var json = $.parseJSON(jqXHR.responseText);
    var msg = '' + json.errorMessage + '.';
    $("#resultado-upload").html(msg);
} catch(e) { 
    var msg = 'Ocorreu um erro ao tentar manipular os dados. Verifique sua conexão com o banco de dados.';
    $("#resultado-upload").html(msg);
}

No catch você deveria informar o erro do parseJSON, mas ao invés disto você criou um erro no front-end que não corresponde ao erro do jqXHR.responseText, ou seja é uma falha de lógica sua. O correto era apresentar o erro da variável e, o uso do $.post também está sem o done e o $.post não faz upload até aonde sei, você deverá usar FormData pra isto.

Um exemplo como $.ajax e FormData:

function GravaUpload(event) {
    var arquivo = $('#frmUpload input[name=fileUpload]');

    var dados = new FormData;
    dados.append('fileUpload', arquivo[0]);

    $.ajax({
        url: 'file/destination.html', 
        type: 'POST',
        data: dados,
        dataType: "json",//Força o tipo json na resposta
        processData: false
    }).done(function(data) {
        $("#resultado-upload").html(data.msg);
    }).fail(function(jqXHR, textStatus, errorThrown) {
        $("#resultado-upload").html("Erro:" + textStatus);
    });
}

Como alternativa pode usar também https://github.com/blueimp/jQuery-File-Upload

Resolvendo o problema no back-end

O outro problema está no PHP, aonde você setou isto $aretorno["msg"], mas a variável $aretorno não existe, então deve estar ocorrendo algum erro no seu php dizendo algo como:

Undefined variable $aretorno

Para corrigir basta criar a variavel do tipo array, assim:

error_reporting(E_ALL);
ini_set('display_errors', 1);

$aretorno = array();//Cria a variavel

if ($_SERVER['REQUEST_METHOD'] == 'POST') { 

    $name     = $_FILES['fileUpload']['name'];
    $tmpName  = $_FILES['fileUpload']['tmp_name'];
    $error    = $_FILES['fileUpload']['error'];
    $size     = $_FILES['fileUpload']['size'];
    $ext      = strtolower(pathinfo($name, PATHINFO_EXTENSION));

    switch ($error) {
        case UPLOAD_ERR_OK:
            $valid = true;
            //validate file extensions
            if ( !in_array($ext, array('jpg','jpeg','png','gif','doc','docx','pdf','xls')) ) {
                $valid = false;
                $aretorno["msg"] = 'Extensao de arquivo invalida ';
            }
            //validate file size
            if ( $size/1024/1024 > 2 ) {
                $valid = false;
                $aretorno["msg"] = 'Tamanho do arquivo e superior a tamanho maximo permitido';
            }
            //upload file
            if ($valid) {
                $targetPath =  dirname( __FILE__ ) . DIRECTORY_SEPARATOR. 'arquivos' . DIRECTORY_SEPARATOR. $name;
                move_uploaded_file($tmpName,$targetPath); 
                header( 'Location: DetalhesContrato.php' ) ;
                exit;
            }
            break;
        case UPLOAD_ERR_INI_SIZE:
            $aretorno["msg"] = 'O arquivo enviado excede a directiva upload_max_filesize em php.ini.';
            break;
        case UPLOAD_ERR_PARTIAL:
            $aretorno["msg"] = 'O arquivo foi apenas parcialmente enviado.';
            break;
        case UPLOAD_ERR_NO_FILE:
            $aretorno["msg"] = 'Nenhum arquivo foi transferido.';
            break;
        case UPLOAD_ERR_NO_TMP_DIR:
            $aretorno["msg"] = 'Faltando uma pasta temporaria. Introduzida no PHP 4.3.10 e PHP 5.0.3.';
            break;
        case UPLOAD_ERR_CANT_WRITE:
            $aretorno["msg"] = 'Falha ao gravar arquivo em disco. Introduzido no PHP 5.1.0.';
            break;
        default:
            $aretorno["msg"] = 'Erro desconhecido';
        break;
    }
} else {
    //Envia um erro acaso o usuário tente acessar o script por outros métodos
    $aretorno["msg"] = 'Método HTTP não suportado para está ação';
}

header('Content-Type: application/json');
echo json_encode($aretorno);

Extras

Note que o pathinfo só pega a extensão e muitas vezes a extensão pode não representar o conteudo real do arquivo, já que a extensão pode ser alterada, isto é muito IMPORTANTE, pois se quer garantia que o tipo de arquivo enviado é o que deseja então terá que usar outro método, eu respondi um questão sobre isto e ela pode lhe ajudar, veja:

Basta alterar a variável para:

$permitidos = array(
    'jpg','jpeg','png','gif','doc','docx','pdf','xls'
);

e usar a variavel $tmpName para pegar o mimetype.

$permitidos = array(
    'jpg','jpeg','png','gif','doc','docx','pdf','xls'
);

$infos = mimeType($tmpName);

//Transforma image/jpeg em jpeg por exemplo
$infos = preg_replace('#^[a-zA-Z\-]+\/#', '', $infos);

$infos = str_replace('x-', '', $infos);

if (false === in_array($infos, $permitidos)) {
    $aretorno["msg"] = 'O tipo de arquivo enviado é inválido, permitido somente imagens';
}
1
  • 2
    Fantástico, muitíssimo obrigado @Guilherme Nascimento, a explicação ficou completa. Commented 29/07/2015 às 18:47

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .