Как обработать ответ сценария обработки backend coldfusion

Я реализовал plupload с помощью внутреннего скрипта ColdFusion (доступен по адресу https://gist.github.com/1116037). ).

Атрибут url на странице загрузки — url : '../upload.cfc?method=upload'. Это просто вызывает функцию внутри скрипта cfc. Это работает нормально. Этот сценарий также создает переменную под названием «ответ» для хранения информации о загруженных файлах.

Проблема, с которой я сталкиваюсь, заключается в доступе к информации, содержащейся в переменной «ответ». Я хотел бы отобразить эту информацию в таблице после того, как все файлы были загружены на сервер.

Я использую queue_widget для своих нужд, думаю, что событие (onComplete) должно быть вызвано для вызова функции для обработки информации в переменной, но я не знаю, как это сделать.

Мне нужно получить доступ к информации, хранящейся в переменной «ответ», предпочтительно в коде ColdFusion. Кому-нибудь уже удалось заставить plupload работать с ColdFusion?

Любая помощь, руководство или кодирование будут оценены.

Вот полный код, который я использовал:

Это главная страница - queue_widget.cfm

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Plupload - Queue widget example</title>
<link rel="stylesheet" href="../../js/jquery.plupload.queue/css/jquery.plupload.queue.css" type="text/css" media="screen" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script type="text/javascript" src="../../js/plupload.js"></script>
<script type="text/javascript" src="../../js/plupload.flash.js"></script>
<script type="text/javascript" src="../../js/jquery.plupload.queue/jquery.plupload.queue.js"></script>
</head>
<body>
  <h1>Queue widget example</h1>
  <p>Shows the jQuery Plupload Queue widget and under different runtimes.</p>
  <div style="float: left; margin-right: 20px">
  <h3>Flash runtime</h3>
    <div id="flash_uploader" style="width: 700px;">Your browser does not have Flash installed!</div>
  </div>  
  <br style="clear: both" />
<cfoutput><cfset mnum=6></cfoutput>
<script type="text/javascript">
$(function() {
    // Setup flash version
$("#flash_uploader").pluploadQueue({
    // General settings
    runtimes : 'flash',
    url : '../upload.cfc?method=upload',
    max_file_size : '1mb',
    max_file_count: <cfoutput>#mnum#</cfoutput>, // You can limit the num of files that can be uploaded by manipulating the mnum variable above
    unique_names : false,
    multiple_queues : true,
    multi_selection: true,
    filters : [
        {title : "Image files", extensions : "jpg,gif,png"}
    ],
    init : {
        FilesAdded: function(up, files) {
            plupload.each(files, function(file) {
            if (up.files.length > <cfoutput>#mnum#</cfoutput>) {
                up.removeFile(file);
                }
            });
            if (up.files.length >= <cfoutput>#mnum#</cfoutput>) {
                $('#pickfiles').hide('slow');
            }
        },
        FilesRemoved: function(up, files) {
            if (up.files.length < 1) {
                $('#pickfiles').fadeIn('slow');
            }
        }
    },
    resize : {width : 300, height : 10000, quality : 90}, // forces images to be resized to a width of 300px if wider than 300px
    preinit: attachCallbacks,
    UploadComplete: function(up, file, response) {
        if ($("#result").length > 0){
            $("#results").prepend(info.response);
        } else {
            $("#flash_uploader").after("<div id='results'>"+info.response+"</div>");
        }
    },
    flash_swf_url : '../../js/plupload.flash.swf'
});
});
// Where should we go after upload
function attachCallbacks(Uploader){
    Uploader.bind('FileUploaded', function(Up, File, response){
        function IsJson(response) {
        alert('Response from server: ' + response.file); // for testing only
        counter++
        var newRow = '<tr><td><input type="hidden" name="file_'+counter+'" value="'+response.file+'">'
        newRow += 'Label the file: '+response.file+' <input type="text" name="filename_'+counter+'"></td></tr>'
        $("#detail").append(newRow)
    }});
};
</script>
<div id="results"></div>
<table id="detail">
</table>
<cfif IsDefined('response')><cfdump var="#response#"></cfif>
</body>
</html>

Это страница обработки бэкэнда - upload.cfc

<cfcomponent>
  <cffunction name="upload" access="remote" returntype="struct" returnformat="json" output="false">
    <cfscript>
      var uploadDir = expandPath('/uploads/'); // should be a temp directory that you clear periodically to flush orphaned files 
      var uploadFile =  uploadDir & arguments.NAME;
      var response = {'result' = arguments.NAME, 'id' = 0};
      var result = {};
    </cfscript>     

    <!--- save file data from multi-part form.FILE --->
    <cffile action="upload" result="result" filefield="FILE" destination="#uploadFile#" nameconflict="overwrite"/>

    <cfscript>
      // Example: you can return uploaded file data to client 
      response['size'] = result.fileSize;
      response['type'] = result.contentType;
      response['saved'] = result.fileWasSaved;
      return response;
    </cfscript>
  </cffunction>
</cfcomponent>

Вы можете попробовать приведенный выше пример здесь: [url] www.turn2cash.co.uk/plupload/examples/jquery/queue_widget.cfm [/url]

Как упоминалось выше, скрипт хорошо работает с загрузкой (в данном случае) до 6 изображений, что определяется переменной mnum. Мне нужна помощь в том, как получить доступ к загруженным файлам (с обновлением страницы) и иметь возможность манипулировать ими.

Я настроил пример (используя cffileupload) того, что мне нужно здесь [url] www turn2cash.co.uk/a/index.cfm [/url] Хотя это работает нормально, для этого требуется обновление страницы, что я и делаю. пытаясь избежать.

Пожалуйста, окажите любую помощь, которую вы можете.

Добавлено 7 сентября 2012 г.

Я попробовал оба метода, предложенные Мигелем, но не добился положительных результатов. Они фактически заставили пользовательский интерфейс вообще не сеять. Однако я нашел это и попробовал:

preinit: attachCallbacks,
        UploadComplete: function(up, file, response) {
            if ($("#result").length > 0){
                $("#results").prepend(info.response);
            } else {
                $("#flash_uploader").after("<div id='results'>"+info.response+"</div>");
            }
        },
        flash_swf_url : '../../js/plupload.flash.swf'
    });
});
// Where should we go after upload
function attachCallbacks(Uploader){
    Uploader.bind('FileUploaded', function(Up, File, Response){
        alert('Response from server: ' + Response.response);
});
};
</script>

Теперь я получаю предупреждение, отображающее:

Response from server: {"saved":true,"result":"home.png","id":"0","size":"5988","type":"image"}

Это, по крайней мере, доказывает, что скрипт cfc работает и возвращается переменная 'response'. Я до сих пор не знаю, как использовать эту информацию, так как не знаю jquery, ajax или javascript. Пожалуйста, помоги, если можешь.


person Paresh    schedule 28.08.2012    source источник
comment
Что вы уже сделали со своей стороны? Что вы пробовали?. Вы должны получить ответ обратно в браузер, который вы можете проанализировать, или уведомление о том, что загрузка завершена, чтобы вы могли перенаправить пользователя на страницу успеха, которая затем покажет им информацию о файлах, которые они загрузили.   -  person Dan Short    schedule 28.08.2012
comment
Вы должны иметь возможность просто десериализовать ответ (это json) в структуру JS, а затем вывести его так, как вам нужно. Ответ кода, который вы идентифицировали, будет в формате json — он предназначен для вызова со страницы, как вы описываете, но обработка ответа json обычно выполняется на стороне клиента с помощью чего-то вроде jquery или вашего любимая библиотека js.   -  person Mark A Kruger    schedule 28.08.2012
comment
Ваше предложение - это то, что я пытаюсь сделать, но не знаю, как это сделать! Plupload управляется событиями, как показывают их примеры, после завершения всех загрузок запускается событие, которое вызывает функцию для обработки ответа. Приведите пример того, как анализировать или десериализовать ответ, поскольку я не уверен в json. Я попытался добавить 'preinit: attachCallbacks' и функцию attachCallbacks(Uploader){ Uploader.bind('FileUploaded', function(Up, File, response){ alert('Ответ сервера: '+response.name); }); }; в соответствии с предложениями форума, но это не работает   -  person Paresh    schedule 28.08.2012
comment
Не могли бы вы опубликовать пример ответа от upload.cfcmethod=upload? Спасибо   -  person Russ    schedule 29.08.2012
comment
Метод upload.cfc?method=upload прекрасно работает! Дополнительный код, который я добавил в соответствии с предложениями форума, ничего не делает. Файлы успешно загружены и все. Мне нужно одно из событий pluploads, чтобы запустить функцию. Это то, что я не знаю, как это сделать.   -  person Paresh    schedule 29.08.2012
comment
Можете ли вы опубликовать пример кода вашего кода Plupload и вашего обработчика обратного вызова?   -  person Dpolehonski    schedule 31.08.2012
comment
Вы пробовали метод jQuery parseJSON? Посмотрите здесь: [plupload json response][1] [1]: stackoverflow.com/ вопросы/8298793/plupload-json-ответ   -  person Miguel-F    schedule 04.09.2012
comment
Спасибо, Мигель, я не знаю, как обрабатывать ответы json, есть ли возможность предоставить пример, который я мог бы интегрировать в свой код выше, чтобы я мог увидеть, как это работает? Это также поможет мне в дальнейшей работе! Я действительно был бы признателен за это.   -  person Paresh    schedule 05.09.2012


Ответы (1)


Ссылка, которую я разместил ранее, содержит пример кода. Извините, что публикую это как ответ, но, поскольку у меня нет представителя, я не могу комментировать.

Я думаю, что часть вашей путаницы связана с обработкой запроса. У вас есть эта строка кода внизу вашего примера.

<cfif IsDefined('response')><cfdump var="#response#"></cfif>

Это никогда не сработает, потому что страница coldfusion обрабатывается до того, как вы сделаете ajax-вызов javascript на сервер для загрузки файла. Вам нужно будет обработать ответ в javascript.

Вы видите это предупреждение от функции attachCallbacks?

alert('Response from server: ' + response.file); // for testing only
person Miguel-F    schedule 05.09.2012
comment
Нет, на это оповещение нет ответа! Я могу только предположить, что код в документе cfc работает правильно, когда файл загружается. - person Paresh; 06.09.2012
comment
Вы можете отправить себе электронное письмо или войти в файл из вашего документа cfc, чтобы убедиться, что он вызывается (а также просмотреть ответ, который он отправляет обратно). Раньше я не использовал plupload, но использовал jquery для вызовов ajax. Я знаю, что это можно сделать, вопрос только в том, где разместить код. Вы смотрели на встроенную функцию ColdFusion для загрузки нескольких файлов? cffile action = uploadAll ссылка здесь - person Miguel-F; 06.09.2012
comment
Да, Мигель, я попробовал это и настроил систему для успешной загрузки нескольких файлов. У меня есть рабочая модель здесь [url] www turn2cash.co.uk/a/index.cfm [/url]. Единственная проблема заключается в том, что это приводит к обновлению страницы, а этого я пытаюсь избежать. Спасибо за предложение! - person Paresh; 07.09.2012
comment
Хорошо, вы упомянули об этом в своем вопросе. Я нашел этот похожий вопрос здесь. Посмотрите на пример кода из этого поста, особенно на раздел uploader.bind. Он немного отличается от вашего. Ответ на их проблему заключался в том, чтобы вместо этого использовать $.parseJSON(response.response). - person Miguel-F; 07.09.2012
comment
Еще одна вещь, которую я только что заметил, в вашем бэкэнде cfc вам нужно вернуть ответ в виде JSON. Просто установка типа возвращаемого значения в объявлении функции не делает этого автоматически. Итак, вместо «ответного ответа;» попробуйте «вернуть SerializeJSON (ответ);». Это объясняет, почему вы не видите предупредительный огонь. Вы сначала проверяете, является ли ответ JSON, а не нет. Возможно, это была ваша проблема все время. Сначала попробуйте это и посмотрите, получите ли вы это предупреждение. Если нет, попробуйте другое предложение с $.parseJSON(response.response). - person Miguel-F; 07.09.2012
comment
Я пробовал оба метода, но не добился положительных результатов. Они фактически заставили пользовательский интерфейс вообще не сеять. Однако я нашел это и попробовал: - person Paresh; 07.09.2012
comment
Я не знал, как ответить длинным ответом и кодом здесь, поэтому я добавил его в конец моего исходного сообщения выше. - person Paresh; 07.09.2012
comment
Хорошо, круто, похоже, ваш ответ JSON возвращается. Я думаю, теперь вопрос в том, что именно вы пытаетесь сделать? Ваша загрузка работает, и ваш cfc возвращает вам информацию. Вы должны иметь возможность ссылаться на каждую часть возвращенного JSON, сначала проанализировав ответ, как я упоминал ранее; var newobj = jQuery.parseJSON(Response.response); Затем вы сможете ссылаться на каждую часть как newobj.result или newobj.size и т. д. - person Miguel-F; 10.09.2012