bootstrap jquery file upload and laravel

Question

I'm trying to implement the blueimp jquery file upload with a laravel app. https://github.com/blueimp/jQuery-File-Upload

I've set up the form which is working and behaving as expected using the plugin but I'm having problems creating the server side scripts in laravel to handle the upload.

I've changed the form action as follows:

<form id="fileupload" action="{{ route('photos.post.upload') }}" method="POST"
                              enctype="multipart/form-data">

in main.js (part of the plugin) I've set the url to:

$('#fileupload').fileupload({
    // Uncomment the following to send cross-domain cookies:
    //xhrFields: {withCredentials: true},
    url: '/photos/upload/'
});

In my routes file I have created a route as follows:

Route::any('photos/upload', [
    'as'=>'photos.post.upload',
    'uses' => 'PhotosController@uploadImage'
]);

My function in the controller:

public function uploadImage()
{
    dd(Input::file());

    return Response::json(
        array(
            "files" => array(
                "name" => "post"
            ))
    );
}

At this point I simply want to test the form data is received. However on upload the data is empty.

Using either Route::any() or Route::post() but get a 301 error (permanently moved)

Checking in google chrome it appears POST is being used for the upload as expected and looks like the file is included.

So.

1. Why am I getting the 301 error - what am I missing from either the javascript side
2. Why does Input::file() return empty

Any help appreciated

Answer 1

Laravel redirects if a trailing slash is present in the URL, like you have at url: '/photos/upload/', so it’ll be redirected with a 301 status to the URL without the trailing slash.