0

I'm trying to use a Uploader component from RSuite, for upload a picture to the Express server:

<Uploader action={process.env.REACT_APP_API_URL + '/loadMap'} draggable headers={{Authorization: 'Bearer ' + localStorage.getItem('token')}} name="map">
    <div style={{ width: '100%', height: 300, display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
        <span>Click or Drag map image to this area to upload</span>
    </div>
</Uploader>

When I upload an image, the request arrive to the Express, but I can't found the content of the image that I upload. In the Request (IncomingMessage) I can't found the attribute 'files' or 'file' or nothing that have the content of the picture:

exports.loadMap = async (req, res, next) => {
    let mapContent = req.body.map;
    let mapFile = req.file;
}

How can I get this content for save into the server? Thanks.

Allid
  • 1
  • 1

1 Answers1

0

Finally I found the solution. My problem was in NodeJS, instead of RSUITE as I thought, that need some package for read the data from a FORM. I use formidable package from npm:

exports.loadMap = async (req, res, next) => {
    const formidable = require('formidable');
    const uploadFolderTemp = path.join(__dirname, "..", "images", 'temp');

    var form = new formidable.IncomingForm({uploadDir: uploadFolderTemp});
    form.parse(req, async (err, fields, files) => {
        const fileExtension = '.' + files.file.originalFilename.split('.')[1];
        fs.rename(files.file.filepath, UPLOAD_FOLDER + '/' + FILENAME + fileExtension, async (err) => {
            next();
        });
    });
}
Allid
  • 1
  • 1