How to upload pictures cloudinary?

Question

I write code simple code for upload images cloudinary. But somewhere have errors.

import axios from 'axios'

const uploadPic = async (media) => {
    try {
        const form = new FormData();
        form.append('file', media);
        form.append('upload_presets', 'social_media');
        form.append('cloud_name', 'tmcotem');
        const res = await axios.post(process.env.CLOUDINARY_URL, form)
        return res.data.url;
    } catch (error) {
        console.log(error);
    }
}
export default uploadPic;

CLOUDINARY_URL is CLOUDINARY_URL: "https:api.cloudinary.com/v1_1/tmcotem/image/upload

But I cant upload. Please help me. i dashboard cloudinary cloud name is tmcotem but top right bar written another cloud name. I try these cloud names. But cant it. when i upload image i get this error:

Error: Request failed with status code 400 at createError (createError.js:16:1) at settle (settle.js:17:1) at XMLHttpRequest.onloadend (xhr.js:54:1)

Answer 1

There is no parameter in Cloudinary called upload_presets it should be upload_preset instead (see the upload() parameters for reference.

Also, you won't need to pass the cloud_name in your form-data as it's part of the URL you're POSTing to so that line can be removed entirely.

Those two changes should resolve the upload issues.