0

I need some help in my lasts steps when uploading a file to cloudinary from node.js (using sails.js)

I give you the code below: Controller:

var cloudinary = require('cloudinary');

index: function(req, res){
        cloudinary.config({ 
            cloud_name: 'cloud_name', 
            api_key: 'api_key', 
            api_secret: 'api_secret' 
        });

        var cloudinary_cors = "http://" + req.headers.host + "/cloudinary_cors.html";
        var uploader = cloudinary.uploader.image_upload_tag('image_id', { callback: cloudinary_cors, html: { multiple: 1 } });
        var cloudinary_script = cloudinary.cloudinary_js_config();

        return res.view('myaccount/myaccount', { uploader: uploader, cloudinary_script: cloudinary_script });
    }

Then my scripts are these:

<!--SCRIPTS-->
<script type="text/javascript" src="/js/dependencies/sails.io.js"></script>
<script type="text/javascript" src="/js/dependencies/jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="/js/bootstrap.min.js"></script>
<script type="text/javascript" src="/js/jquery.ui.widget.js"></script>
<script type="text/javascript" src="/js/jquery.iframe-transport.js"></script>
<script type="text/javascript" src="/js/jquery.fileupload.js"></script>
<script type="text/javascript" src="/js/jquery.cloudinary.js"></script>
<%-cloudinary_script%>
<!--SCRIPTS END-->

And finally my form:

<form action="" method="post" enctype="multipart/form-data" class="upload_form">
    <div class="form-group">
        <label>Profile picture</label>
        <%-uploader%>
    </div>
    <div class="form-group">
        <button type="submit" class="btn btn-default">Submit</button>
    </div>
</form>

Well, everything works fine, it uploads my file when i select it (i couldn't make it work without auto-upload when selecting the file) so... first i need to get notified in the controller when the file is fully uploaded and get the image id so i can save it in the database, i found some guides but i couldn't make it work either, this for example: Can't get image_id from Cloudinary in NodeJS hope you can help me, thanks again!

Community
  • 1
  • 1
matuuz
  • 135
  • 1
  • 5
  • 11

1 Answers1

0

First, I couldn't see here the rendered <%-uploader%> part, so specifically I'm not sure how your input field looks like. Second, I'm not sure I fully understand your question. Are you asking how to not automatically upload the file upon selection, and perform the actual upload only afterwards (e.g., when hitting the "Submit" button)? Or, are you asking how to get the results of the upload when done?

Itay Taragano
  • 1,901
  • 1
  • 11
  • 12
  • Hi, i need both things, to not upload automatically when i select the file, but the priority for me is to get notified in the controller when the file is uploaded, i'm using direct file upload from the browser because i don't want to use my server resources when uploading – matuuz Jan 09 '16 at 17:08
  • 1
    Regarding not uploading automatically - You can disable the `autoUpload ` parameter. For more information: http://support.cloudinary.com/hc/en-us/articles/202519982-Images-are-automatically-uploaded-upon-selection-How-can-I-disable-it-. – Itay Taragano Jan 10 '16 at 08:00
  • 1
    Regarding the response - You should point the input field to your model's attribute and the identifier will be passed there when you hit the submit button. We recommend using Cloudinary's Node.js library to generate the input field. See: https://github.com/cloudinary/cloudinary_npm/blob/master/samples/photo_album/views/photos/add_direct.ejs#L19. Alternatively, you can have the full details of the upload on the client-side, and pass any of its parameters to your server. See - https://github.com/cloudinary/cloudinary_npm/blob/master/samples/photo_album/views/photos/add_direct.ejs#L77 – Itay Taragano Jan 10 '16 at 08:05