How to save a document with an attached file from a Vue.js frontend?

Hello everyone,

I’m working on a project with a custom Vue.js frontend that needs to interact with a Frappe backend. I’m trying to figure out the correct way to upload a file and attach it to a specific document.

I’ve successfully uploaded the file and received a response with the file_url, attached_to_name, and attached_to_doctype. I’ve also found the frappe.desk.form.save.savedocs API.

My question is: Is it the right approach to use these two separate steps?

  1. First, upload the file using the Frappe upload API.
  2. Then, call the savedocs API to update my custom DocType, passing the file_url from the first step as the value for my Attach field.

I’ve seen some examples where the file upload and document save happen in a single step, but I’m unsure if that’s possible when working with an external frontend like Vue.js.

Any guidance or best practices on this workflow would be greatly appreciated.

Thank you.