CloudQuery Upload Авторизация

Question

Я использую Force.com Apex и VF, пытаясь использовать CloudMan для управления контентом. Я застрял на следующее из Chrome (не знаю, почему он показывает «неопределенными», как Облако Имя определяется в JS):

POST https://api.cloudinary.com/v1_1/undefined/upload 401 (Unauthorized) ...... api.cloudinary.com/v1_1/undefined/upload:1 

В момент разочарования бы очень признателен за любую помощь. Вот код (обратите внимание на комментарии):

• АПЕКС

:

public String getCldSig() { 

     Datetime d = datetime.now(); 
     Long uxtime = d.getTime()/1000; //method provides epoch/unix time 
     String apisec = '<some_secret>'; 
     String serial = 'callback=<some_url>&public_id=<some_id>&timestamp=' + uxtime + apisec; 
     Blob sha = Crypto.generateDigest('SHA1', Blob.valueOf(serial)); 
     String sig = EncodingUtil.convertToHex(sha); //perhaps I need to do UTF-8 
     String jsoSerial = '{"public_id":"<some_Id>",'; 
     jsoSerial += '"timestamp":"'+ uxtime + '",'; 
     jsoSerial += '"callback":"<some_url>",'; //maybe an issue with hosting the CORS html on a VF page. 
     jsoSerial += '"signature":"' + sig + '",'; 
     jsoSerial += '"api_key":"<some_key>"}'; 
     return jsoSerial.escapeHtml3(); //seems to be the right escape output HTML 
} 

• Javascript/JQuery:

     $.cloudinary.config({"api_key":"<some_key>", "cloud_name":"<some_id>"});      
         $('.cloudinary-fileupload') 
          .fileupload({ 
          dropZone: ".sceneUpBtn", 
          progress: function (e, data) { 
           $(".progress").text("Uploading... " + Math.round((data.loaded * 100.0)/data.total) + "%"); 
          } 
          }); 
         $('.cloudinary-fileupload').bind('fileuploadstart', function(e){ 
          $('.sceneUpPrev').html('Upload started...'); 
         });      
         $('.cloudinary-fileupload').bind('fileuploadfail', function(e){ 
          $('.sceneUpPrev').html($.cloudinary.error); //**due to lack of documentation don't know how to get any specific error message using the jQuery library. Would expect messages similar to AWS S3 
         });  
         $('.cloudinary-fileupload').bind('cloudinarydone', function(e, data) { 
          $('.sceneUpPrev').html(
           $.cloudinary.image(data.result.public_id, 
            { format: data.result.format, version: data.result.version, 
            crop: 'scale', width: 200 }));  
          $('.image_public_id').val(data.result.public_id);  
          return true; 
         }); 
  

Входной HTML:

<input class="cloudinary-fileupload" 
data-cloudinary-field="upref" 
data-form-data="&quot;public_id&quot;:&quot;<some_id>&quot;,&quot;timestamp&quot;:&quot;1372282433&quot;,&quot;callback&quot;:&quot;<some_url>&quot;,&quot;signature&quot;:&quot;<some_sig>&quot;,&quot;api_key&quot;:&quot;<some_key>&quot;}" 
id="sceneUpload" 
name="file" 
type="file"> 

Answer 1

С большой помощью от Tal в Cloudinary я достиг успеха! Я резюмировать решение:

1. Не экземпляр библиотеки Cloudinary в в $ (документ) .ready(), вместо того, чтобы просто подключить его в непосредственно в сценарий раздела

   <script type="text/javascript">    
       $.cloudinary.config({"api_key":"<key>","cloud_name":"<cloud_name>"}); 
   

2. инстанцировать FormData с виджетами FileUpload, это гарантирует, что fileUpload
   загружает ваши параметры отправки json (это проблема синхронизации).

       $('.cloudinary-fileupload').fileupload({ 
            formData : <unescaped json params>, 
            dropZone: $('.sceneUpBtn'),        
            dataType: 'json', 
            done: function (e, data) { 
             $.each(data.result.files, function (index, file) { 
              $('<p/>').text(file.name).appendTo('#filename'); 
             }); 
             }, 
            progressall: function (e, data) { 
             var progress = parseInt(data.loaded/data.total * 100, 10); 
             $('.sceneUpBar').css('width',progress + '%'); 
            } 
          }); 
   

3. Параметры соответствия символов для json params, отправленных на сервер. В Apex знак и вернуть JSON, как например:

   public String getCloudinarySig() { 
       Datetime d = datetime.now(); 
       Long uxtime = d.getTime()/1000; //epoch unix time method in force.com 
       String apisec = '<secret>'; 
       String serial = 'callback=<cors url>&timestamp=' + uxtime + apisec; //Signature needs params here need to match json params below 
       Blob sha = Crypto.generateDigest('SHA1', Blob.valueOf(serial)); //Sha1 digest 
       String sig = EncodingUtil.convertToHex(sha); //Hex conversion 
       String jsoSerial = '{'; 
       jsoSerial += '"api_key":"<key>",'; //these json params need to match signature params above  
       jsoSerial += '"<CORS_url>",';     
       jsoSerial += '"signature":"' + sig + '",'; 
       jsoSerial += '"timestamp":'+ uxtime; 
       jsoSerial += '}'; 
       return jsoSerial;  
   

   }

рад ответить на любые вопросы ...

Answer 2

"не определено" часть URL POST означает, что библиотека JQuery Cloudinary не смог определить cloud_name когда POST URL был сгенерирован. Скорее всего, это потому, что функция $ .cloudinary.config называется слишком поздней. Переместите этот вызов за пределы $ (document) .ready или похожих конструкций.

Еще одна (несвязанная) точка. Селектор во второй строке отсутствует. Он должен читать $ ('. Cloudinary-fileupload')