Recommended way to send FormData about rails-ranger

[ryanmk54]

I don't think ActiveStorage work for this situation because files may need to be uploaded to a different directory on disk based on the class name. With ActiveStorage, files have a single root directory. Shrine allows uploading files to different directories, but it is more complicated than using Ruby's File.open method. I agree that asynchronous uploads are better for performance, but I'll wait to let the other team member decide if he wants to use Shrine or upload the file directly.

[ryanmk54]

Here is what I tried with rails-ranger

import RailsRanger from 'rails-ranger'

const config = {
  axios: {
    baseURL: '/merchandising',
    headers: {
      'Content-Type': 'multipart/form-data',
      'Accept': 'multipart/form-data'
    }
  }
};

export default new RailsRanger(config);

// FDapi is for form-data api
FDapi.post('shelf_tag_templates/upload_image', fd,
{headers: {
  'Content-Type': 'multipart/form-data',
  'Accept': 'multipart/form-data'
}})

Rails server log:

Parameters: {"{}"=>nil}

Here is what works with Axios

import axios from 'axios';
axios.post('/merchandising/shelf_tag_templates/upload_image', fd,
{headers: {
  'Content-Type': 'multipart/form-data',
  'Accept': 'multipart/form-data'
}})

Rails server log:

Parameters: {"custom_file"=>#<ActionDispatch::Http::UploadedFile:0x00007fc8000e7c78 @tempfile=#<Tempfile:/tmp/RackMultipart20201125-27867-1ml5lx0.gif>, @original_filename="amazed.g
if", @content_type="image/gif", @headers="Content-Disposition: form-data; name=\"custom_file\"; filename=\"amazed.gif\"\r\nContent-Type: image/gif\r\n">}

[victor-am]

Hmmmm, I never considered the file transfer scenario for the library 🤔
In fact I would suggest a different approach instead:

Usually uploading files into the rails server is not a good idea because, among other issues, it will lock the request thread/process for a long time, increasing the overall response time of the application.

If it suits your scenario you could try asynchronous upload (in which the user uploads the file to S3/Azure/etc via js and then it only sends a link string to rails server to keep track of).

More info in the Active Storage docs: https://guides.rubyonrails.org/v5.2.0/active_storage_overview.html

---

However, if the solution above doesn't fit your needs I will have to test around a bit to see if there is something that can be done or if it should be implemented as a new feature 🤔