Uploading user files

Hello,

I would like to be able to upload user files, send them to backend, change content if necessary.
I see Wix has Upload button control. As well I understand files may be uploaded to Wix server using “startUpload()” API (Wix’s functionality I suppose).

I tried to get started with Wix’s upload button by adding my code in uploadButton_onChange event callback. I understand that FileReader() API may be used to access files. However I saw that FileReader is not supported here.

As well I tried to make similar using HtmlComponent with ‘input’ element, also without success. Later I found the following note: “The HTML element and embed a site element in our Editor are iFrames. Therefore, the code or site you are embedding won’t be responsive, even if it is originally”.

My questions are:

  1. Is it possible to add some custom behaviour to Wix’s Upload button as I tried and access user files programically
  2. Is it possible to create uploader within HtmlComponent, or it will not be possible due to iFrame limitations
  3. Is there any more elegant/correct way to add file upload?

Thanks,
Dima

Hi dmitrybi,
Welcome to the Wix Code Forum.

First, our upload button functionality loads the file into your media manager - the same media manager you can access from the editor when adding an image or document. The upload button then gives you back a wix url to the uploaded file that can be stored in our database or to initiate document download.

At this time we do not support the FileReader API - but that is something we can probably do. What will help us is to learn a bit more about the specific use case you have in mind, as there may be more then one way to support it.

So to answer your questions -

  1. You can upload a file to Wix media manager, but you cannot access it’s content programmatically at this time. This is something we can support.

  2. Using the HtmlComponent you can code your own version of file upload, but you will have to take care of all the details, including upload, storage (I’d suggesting looking at Amazon S3), FileReader API and such. You can also connect the HtmlComponent with the site using the postMessage and onMessage APIs of the HtmlComponent

  3. We are currently revisiting file upload functionality and hopefully will have a simpler and more elegant way soon. Again, if you can share more details about your specific use case, that will help us a lot.

Hi Yoav,

Thank you for the quick reply.

Regarding file upload my use case is following:

  • Let user pick up the file they want to share with me
  • Encrypt the file on user side (HtmlComponent, postMessage & onMessage APIs you mentioned)
  • Store the file on AWS (S3 as you suggested) / Google Cloud / any other cloud storage. As I understood the more correct way to do it from backend. Therefore I’m looking for a way to upload and transfer the file there.

Definitely I will have files stored in Wix media manager, but for most of the files I would like to bypass it.
And sure I’ll be glad if I could maximally reuse the uploader Wix developed instead of coding my own.

Regarding AWS and others:
Right now I see that ‘require’ is not supported, and I believe there are no 3rd party modules installed at backend side.
Are you planning to support some (aws-sdk for example) at backend?

Thanks,
Dima

Dima, were you ever able to get this to work, been in forums and groups all week and trying to find a way to have my website members able to upload media (video) to me. Currently looking at AWS, but thought i’d ask what you finally used and or got working. thanks

Hi Charles,
I didn’t try it since that time, apparently I’ll be back to file upload soon.
I also thought about AWS - to upload files directly to Amazon, but it makes the solution more complicated, so not sure it will be the final direction.

Dima, its been very difficult even to get a straight answer from anyone in forums and groups, i spent all day yesterday asking questions with mixed results. I was told AWS would work with rpm packages, not totally sure what that even means currently. All be spending sometime today as well to see if it’s even an option on Wix or do i need to move on to something else like wordpress, kinda would like to stay with Wix however. So had you tried the whole AWS? does it work? but just complicated. I can let you know what and or if I find anything out on my end. thanks for the reply

Charles, I didn’t try AWS, but I saw that at backend (WIX editor) they had added an ability to install some node.js packages, including AWS. It should allow your WIX backend to connect to AWS services easily. However from Yoav’s reply above looks like we are not able to access the uploaded files programmatically, so it still doesn’t solve the problem.
FYI, you are able to upload the files easily to WIX media manager with existing WIX functionality in case you don’t need to access the files from your code.

I’ve also been searching for a solution to read the contents of a file (using FileReader) and pass the contents down to our backend to store the file in our backend DB. How did you guys go about doing it?

Would be so much easier if Wix exposes FileReader API.

1 Like

Hi @yoav-wix , I know it’s been a couple years but is there any update on the FileReader API & Wix?

Or also even exposing the public url after upload, not just the Wix url.

1 Like