Cloudinary Nodejs Image Upload Setup Issue

Question

I'm trying to upload images directly from the browser to Cloudinary, but I'm having trying with the configurations. I'm following this tutorial and I'm stuck on the step where I need to include this:

var cloudinary_cors = "https://" + request.headers.host + "/cloudinary_cors.html";

I'm getting an error saying "request is not defined". The template page does render, but the input field does nothing. I also have the "cloudinary_cors.html" file in my static directory and I'm using Pug as my template engine. Here is my template page thus far:

//upload.pug
extends layout

block content
  script(type='text/javascript', src='jquery.min.js')
  script(type='text/javascript', src='/javascripts/jquery.ui.widget.js')
  script(type='text/javascript', src='/javascripts/jquery.iframe-transport.js')
  script(type='text/javascript', src='/javascripts/jquery.fileupload.js')
  script(type='text/javascript', src='/javascripts/jquery.cloudinary.js')

  cloudinary.cloudinary_js_config()

  script.
    $(function() {
      if($.fn.cloudinary_fileupload !== undefined) {
        $("input.cloudinary-fileupload[type=file]").cloudinary_fileupload();
      }
    });

    var cloudinary_cors = "http://" + request.headers.host + "/cloudinary_cors.html";
    cloudinary.v2.uploader.image_upload_tag('image_id', {callback: cloudinary_cors});

 form(action='/create', method='post')
  .field
   label Image ID
   input(name='image_id')
  button.ui.primary.button(type='submit') Post

Roee Ben-Ari Roee Ben-Ari · Accepted Answer · 2017-11-12T12:37:32

Please refer to Cloudinary sample project on Github - https://github.com/cloudinary/cloudinary_npm/tree/master/samples/photo_album

And to this part in specific - https://github.com/cloudinary/cloudinary_npm/blob/master/samples/photo_album/views/photos/add_direct.ejs

Cloudinary Nodejs Image Upload Setup Issue

1 Answers