1

Atualmente eu fiz um mini projeto de upload de arquivos utilizando o laravel sem requisições assíncrona (Ajax) e funcionou. Fui tentar fazer o upload de imagens utilizando o ajax e meu request está retornando null, sendo assim não consigo manipular a base de dados.

Já procurei algumas soluções no forúm e nenhuma resolveu, vi que muitos eram o problema de enctype do formulário, porém acredito que o meu não seja.

Route:

Route::get('/', 'PostControlador@index');
Route::get('/arquivos-json', 'PostControlador@index');
Route::post('/', 'PostControlador@store');

View:

        <form method="POST" enctype="multipart/form-data">
            <input type="file" name="arquivo" id="arquivo">
            <button type="button" class="btn btn-primary btn-save-post">Enviar</button>
        </form>

Javascript:

        $('.btn-save-post').on('click', function(){

            let formData = new FormData();
            formData.append('arquivo', $('#arquivo').val());

            $.ajax({
                url: '{{ url('/') }}',
                method: 'post',
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                processData: false,
                contentType: false,
                data: formData,
                success: function(response) {
                    console.log(response);
                },
                error: function(error) {
                    console.log(error);
                }
            });

        });

Controller:

public function store(Request $request)
{
        dd ( $request->all() ); 
        // result: ["arquivo" => "C:\fakepath\2028_2229862022_a2e8c5716f_320_240_nofilter.jpg"]


        dd ( $_FILES ); 
        // result: []


        dd ( $request->file('arquivo') ); 
        // result: null


        dd ( $request->arquivo ); 
        // result: "C:\fakepath\65535_48730933186_d4b4dd1979_320_240_nofilter.jpg"
}

Como pôde ter visto nesse código, o $request->all() e $request->arquivo Retornam normalmente o arquivo, já a global $_FILES e o $request->file('arquivo') retornam null.

3
  • Sai do ajax e passa direto pro laravel e pega com $request->file('arquivo'); ou usa o fileReader do js Commented 18/10/2019 às 21:01
  • @LucasAntonio obrigado por comentar, mas nesse caso ele ficaria assíncrono, igual o ajax sem precisar fazer o refresh da página?
    – Igor AC
    Commented 19/10/2019 às 0:29
  • Com $request->file não ele vai redirecionar para outra tela e voltar, com ajax tenta usar o fileReader que é a biblioteca js para trabalhar com arquivos. Commented 19/10/2019 às 12:07

1 Resposta 1

2

Você esta passando o valor errado no formdata, o .val() em jQuery ou .value em JavaScript puro não pegam o arquivo, só pega o nome, logo você não está fazendo upload, você está enviando o caminho do arquivo, o correto seria isto:

formData.append('arquivo', $('#arquivo').get(0).files[0]);

Isto porque .get(0) pega o input e o .files[0] pega o primeiro arquivo (mesmo que não sendo upload multiplo ele trabalha como indice) assim você adiciona ele diretamente no FormData, então para fazer o upload pode usar as proprias funções do Laravel, como do exemplo da documentação: https://laravel.com/docs/5.8/filesystem#file-uploads

public function store(Request $request)
{
    $path = $request->file('arquivo')->store('pasta_aonde_desejo_salvar');

    dd($path);
}
3
  • obrigado por responder, infelizmente o sua solução não funcionou para mim, mesmo eu fazendo desse jeito, ele retorna null ao utilizar o $request->file('arquivo'). E quando eu debug, ele dá o erro message: "Call to a member function store() on null", ou seja o store está recebendo um valor nulo, que nesse caso seria a imagem. Eu já fiz outros uploads utilizando o PHP sem framework e com codeigniter, ambos utilizando ajax e nunca tive esse tipo de problema. E o pior que ao utilizar a superglobal $_FILES ele retorna vazio.
    – Igor AC
    Commented 19/10/2019 às 0:28
  • @IgorAC corrigi o upload ajax, veja como ficou.
    – Syzoth
    Commented 19/10/2019 às 1:37
  • Sensacional meu jovem, funcionou que é uma beleza. muito obrigado!!
    – Igor AC
    Commented 19/10/2019 às 13:54

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 .