Upload data to Yesod server using input forms

Question

What is a correct way to uploading files via custom input forms in Yesod?

I developed a frontend in AngularJS, and I pass data to and from the server via JSON objects. However, this does not work when uploading files. For this reason I resorted to forms.

Gathering different resources I ended up with the following code. On the client side I use the following function:

this.submitNewMeas = function() {
    var selected_file = document.getElementById('measurements').files[0];
    var fd = new FormData();
    fd.append("measurementsFile", selected_file);

    var response =  $http({
    method: 'POST',
    url: '/measurements/'+this.currMedia.id,
    headers: {
                'Content-Type': 'multipart/form-data'
    },
    data: {
                fd
    },
    transformRequest: formDataObject
    });
    ...
    };

And on the server side I receive data as follows:

postMeasurementsR :: MediaId -> Handler Value
postMeasurementsR mediaId =  do
result <- runInputPost $ iopt fileField "measurementsFile"
case result of
    Just fileInfo -> do
        saveMeas fileInfo "measDir"

saveMeas :: FileInfo -> FilePath -> HandlerT App IO (FilePath)
saveMeas file dest = do
  let filename = unpack $ fileName file
      dest = dest </> filename
  liftIO $ fileMove file dest
  return filename

However this causes a server error

20/Nov/2014:13:40:15 +0100 [Error#yesod-core] <<loop>> @(yesod-core-1.4.3:Yesod.Core.Class.Yesod ./Yesod/Core/Class/Yesod.hs:502:5)
Status: 500 Internal Server Error 54.70131s

If I don't try to save the data, then the file information is received, and I am able to see the file name on the server.

I've successfully managed to upload files using Yesod forms, but when it comes to custom forms all my attempts so far have failed.

Any help is greatly appreciated.

Thanks.

Answer 1

dest = dest </> filename

That's the source of your infinite loop: you're saying "dest is defined as itself plus filename." What's happening is that you're shadowing the original declaration of dest. A simple solution is to call the second declaration something like dest' (or better yet, something even more informative).