Cloudinary image upload using Javascript example

Question

I run a program for Cloudinary image upload using Javascript and jQuery without using server.my. My problem is that I followed the instructions for the Cloudinary jQuery plugin but the image did not upload. Kindly post the answer. My code is the following:

<html>
<head>
 <script type="text/javascript">
     $.cloudinary.config({cloud_name:'mycloudname', api_key:’myapikey'});
          $.ajax({
           url: 'http://res.cloudinary.com/mycloudname/image/upload/v1442240142/',
           type: 'POST',
           success: function (response) {
               $('#uploadinput').attr('data-form-data', response);
           }
       });
   </script>
   </head>
   <body>
<script src='js/jquery.min.js' type='text/javascript'></script>
<script src='js/jquery.ui.widget.js' type='text/javascript'></script>
<script src='js/jquery.iframe-transport.js' type='text/javascript'></script>
<script src='js/jquery.fileupload.js' type='text/javascript'></script>
<script src='js/jquery.cloudinary.js' type='text/javascript'></script>
<input name="file" type="file" id="File1" class="cloudinary-fileupload" data-cloudinary-field="image_upload"></input>

   </body>
   </html>

Itay Taragano Itay Taragano · Accepted Answer · 2015-10-15T18:56:47

There are various issues here:

The URL should be different, e.g.,

https://api.cloudinary.com/v1_1/mycloudname/image/upload

If you don't want to use your server, then you should use unsigned uploads, there you must also include an upload preset.

Have a look at the following for more information: http://cloudinary.com/blog/direct_upload_made_easy_from_browser_or_mobile_app_to_the_cloud

Cloudinary image upload using Javascript example

1 Answers