Issue #4681Opened October 21, 2022by Aar-if0 reactions

BUG: Asset manager upload sending empty object to backend endpoint

Question

GrapesJS version

  • I confirm to use the latest version of GrapesJS

What browser are you using?

Firefox

Reproducible demo link

NA

Describe the bug

What is the current behavior?

I have created a custom backend endpoint for storing my assets, when I used the upload method of asset manager it is not sending any data to my backend it sends an empty object, I am getting the asset data at client side inspector also facing the same issue while sending using Axios inside the asset manager

assetManager: {

upload: "http://localhost:5002/api/grapesjs/assets"',

},

Code SnippetTEXT
getting an empty object at backend 


Also tried 


 assetManager: {
      
        uploadFile: async (e) => {
          var files = e.dataTransfer ? e.dataTransfer.files : e.target.files;
          console.log(files[0]);
          let formData = new FormData();
          formData.append("file", files[0]);
          formData.append('test',"testing...");
          console.log(formData);

            await Axios.post("http://localhost:5002/api/grapesjs/assets", {
            headers: {
              "Content-Type": "multipart/form-data",
              "Access-Control-Allow-Original":"*"
            },
            formData  
          })
            .then(function () {
              console.log("Success");
            })
            .catch(function (error) {
              console.log(error);
            });
        },
      },


Same error 



BACKEND CODE 


    private storeassets = async (
    req: Request,
    res: Response,
    next: NextFunction
    ): Promise<void> => {
    try {
    console.log("REQ TO S3")
    console.log(req.body);
    const assetData = req.body;
    console.log("STORING TO S3")
    console.log(assetData)




   Backend console data getting empty object in  formData: {}

   REQ TO S3
  {
  headers: {
   'Content-Type': 'multipart/form-data',
   'Access-Control-Allow-Original': '*'
   },
   formData: {}
  }




### Code of Conduct

- [X] I agree to follow this project's Code of Conduct

Answers (2)

artfOctober 24, 20220 reactions

Sorry but by simply trying to submit an asset the payload I see is correct, so without a reproducible demo, it looks to be an issue on your backend side (ensure to have the proper body-parser).

Aar-ifOctober 31, 20220 reactions

Thanks, worked using Multer, the issue was with the body parser.

Related Questions and Answers

Continue research with similar issue discussions.

Paid Plugins That Match This Issue

Curated by issue keywords and label relevance to help you ship faster.

View all plugins

Loading paid plugin recommendations...

Browse Plugin Categories

Jump directly to plugin category pages on the marketplace.