How to create file upload restful api on parse server side?

#1

Hello,

Since this is a standalone problem, so create the new post here:

I have a simplified cloud function as below, many lines have been commented out, while still met below error. Is there anything missing? Looks like Parse Server met error when parsing form-data. Thanks a lot.

Parse.Cloud.define(‘uploadFile’, async request => {
// console.log(‘uploadFile.request’, request);

// const { base64, fileName } = request;
// console.log(‘uploadFile.fileName=’ + fileName);
return ‘ok’;
// return await new Promise((resolve, reject) => {
// fs.writeFile(images/20211230/${fileName}, base64, ‘base64’, err => {
// if (err) {
// reject(err);
// } else {
// resolve(true);
// }
// });
// });
});

image
image897×590 16.4 KB

image
image1109×443 23.2 KB

#2

That cloud code expects file as base64 string. But you are passing the file directly. You need to choose raw body type then select json. After that convert yout file to base64 string and pass it to json body.

#3

Hi @uzaysan ,

Thanks for your kind help. I understood the base64 solution now, besides this, any other solution that we could pass file directly? via the express route? Compared the two solutions, prons and cons?

I am trying to migrate an old nodejs project to parse server, and thanks again for your kind help!

#4

Hi, you can create your cloud function to handle the upload in any way that suits your needs. We chose to go the route of uploading files to AWS S3. You can see a few different solutions in this post: How do you guys manage profile photos / files?

#5

Thanks @woutercouvaras for kind help, we just use the local file system, currently will not consider store files in the mongodb, or third party storage cloud.
We used vue as front end, and used the restful api provided by Parse Server.

#6

No problem. Have you figured out a solution yet?

#7

Not yet, deciding between base64 and express rest api …
Not sure if base64 is good for files with big size (50M or so)

Also, since we are migrating from old projects, our vue front-end, not sure if it is easy to change to the base64 encoding for sending files to backend…

#8

Base64 is not good for big files as it increases the file size. 50MB file will be 65MB as base64.

#9

Do you need to use a custom function? Parse Server has already a built-in endpoint for uploading files: REST API Guide | Parse

If you need to save the files in your local file system, you can use this file adapter.

#10

Thanks @RaschidJFR , since we are migrating from old restful project, so our base is restful api.
Actually I have found the file adapter before, but not sure how to combine it with cloud function code, and also not see how to save file on the server side via file adapter api.
Could you please kindly help further? Thanks a lot.

#11

Here’s my suggestion:

1. Install the fs-files-adapter, so Parse files are saved to your hard drive.

  1. Install the package:

    npm install @parse/fs-files-adapter

  2. As described in the package’s readme, you just add this to your server’s config file:

    {
  "appId": 'my_app_id',
  "masterKey": 'my_master_key',
  // other options
  "filesAdapter": {
    "module": "@parse/fs-files-adapter",
    "options": {
      "filesSubDirectory": "my/files/folder", // optional, defaults to ./files
      "encryptionKey": "someKey" //optional, but mandatory if you want to encrypt files
    } 
  }
}

2. Upload your files via POST request to Parse’s files endpoint

Make a POST request as described in the guide, just the same way you are currently doing with your cloud function, but instead of sending it to /functions/uploadFile, you send it to /files/name-of-your-file

curl -X POST \
  -H "X-Parse-Application-Id: your-app-id" \
  -H "X-Parse-REST-API-Key: your-rest-api-key" \
  -H "Content-Type: text/plain" \
  -d 'The Content Of Your File' \
  https://yourdomain.com/files/hello.txt

With this, you can leverage Parse File’s functionality such as automatic UUID naming and upload progress (not sure how upload progress works with REST though, I haven’t tested it).

Please Note:

If you still want to use a cloud function for whatever reason, then you don’t need any of these and you should proceed just the way you are doing so far.

Let me know if this helps. If not, maybe share more information about your project and what you are trying to achieve.

1 Like
#12

Really thanks v much @RaschidJFR .

What confused me is the -d part, since we have image files (jpg, png, etc), along with excel files (.xls, xlsx), etc. How should I fill the -d and -H parms for those type files?

Also the doc told that files are limited to 10 megabytes, could this be changed to 50m and how to?

By using multer with express, we could send extra info in the req.body when uploading files, could this be done via Parse’s files function? but the problem with express restful api in Parse server is it lack of the auth/token feature, which makes it unsafe, or we need to write specific code for auth/accessToken…

#13

I just found below info at the link you provided, not quite understand for the ‘@myPicture.jpg’, if the image path at my local windows computer is d:\test.jpg, how should it be? and what Content-Type is for excel files and zip files?Thanks!

curl -X POST \
  -H "X-Parse-Application-Id: APPLICATION_ID" \
  -H "X-Parse-REST-API-Key: REST_API_KEY" \
  -H "Content-Type: image/jpeg" \
  --data-binary '@myPicture.jpg' \
  https://YOUR.PARSE-SERVER.HERE/parse/files/pic.jpg
#14

That syntax is specific to CURL. I’m not very savvy in CURL so I suggest you have a look at its documentation. I see you are using Postman, so you should find the equivalent from CURL to Postman.

You can change the upload limit in your Parse Server’s config file:

1 Like
#15

Thanks so much, I will try it and feedback when getting results.