I've got a coldbox module, which sits on an intranet. I'm trying to
use uploadify (jQuery upload) to upload a file, but I keep getting a
302 error (presumably to the login page).
I've tried appending cftoken,cfid and jsessionid to the jQUery upload
script, but I'm just getting nowhere....
Has anyone done this, and got any advice?
Thanks,
Tom.
Activate some logging to see who is doing the 302.
Luis F. Majano
President
Ortus Solutions, Corp
ColdBox Platform: http://www.coldbox.org
Linked In: http://www.linkedin.com/pub/3/731/483
Blog: http://www.luismajano.com
IECFUG Manager: http://www.iecfug.com
Turns out it only happens in Google Chrome. I think there's a
difference with the way the chrome flash plugin works.
Tom,
Here is how I implemented in. Let me know if you need more info on what
is going on in the code below. It works in all supported uploadify
browsers including Chrome.
Image.cfm view that displays the upload button.
<!--- Multi-image upload button --->
<table cellpadding="3" cellspacing="10">
<tr>
<td><div id="uploadify"></div></td>
<td><b>Select Image(s) to Upload.</b></td>
</tr>
</table>
<script>
//Browse button for multi-image upload.
$(document).ready(function() {
$('##uploadify').uploadify({
uploader: '/includes/javascript/uploadify.swf',
folder: '/tmp',
cancelImg: '/includes/images/cancel.png',
multi: true,
auto: true,
script:
'remote/imageProxy.cfc?method=moveImage&anyextrainfo=#anyextrainfo#',
fileDesc: 'Image files',
fileExt: '*.jpg;*.jpeg;*.gif;*.png',
onComplete:
function(event,queueID,fileObj,response,data){
//alert(fileObj.filePath);
$.ajax({
type: 'post',
url:
'remote/imageProxy.cfc?method=uploadImage&anyextrainfo=#anyextrainfo#',
data: {name:fileObj.name,
contentType:fileObj.type},
success: function(result) {
alert('Success.')
},
error: function(request, error){
alert('There was an
error uploading one of the images, please try again.');
}
});
},
onError:
function(event,queueID,fileObj,errorObj) {
alert("The file " + fileObj.name + "
failed to upload correctly. Pleaes try this file again.")
},
onAllComplete: function(event, data) {
$('##message').html('Files uploaded
successfully.').fadeIn('slow', function() {
setTimeout('$("##message").fadeOut("slow");', 3000); });
}
});
});
</script>
imageProxy
<cfcomponent name="ImageProxy" output="false"
extends="coldbox.system.remote.ColdboxProxy" hint="Image Proxy to tie
our ajax calls to coldbox">
<!--- moveImage --->
<cffunction name="moveImage" output="false" access="remote"
returntype="any" hint="I proxy the call to the event to move the
images">
<cfset var results = "">
<!--- upload the image to the tmp folder --->
<cfset var uploaddir = #expandPath('/')#& "/tmp">
<cfif not directoryExists(uploaddir)>
<cfset directoryCreate(uploaddir)>
</cfif>
<cffile action="upload" filefield="form.fileData"
destination="#uploaddir#" nameconflict="overwrite" />
<cfreturn 1><!--- This is very important. Uploadify
expects a 1 result always --->
</cffunction>
<!--- uploadImage --->
<cffunction name="uploadImage" output="false" access="remote"
returntype="any" hint="I proxy the call to the event to upload the
images">
<cfset var results = "">
<!--- This is an event that handles move the img from
its uploaded temp location to its final location, saves the reference to
the db, or whatever you need it to do --->
<cfset arguments.event = "imageAdmin.uploadImage">
<cfset results =
super.process(argumentCollection=arguments)>
<cfreturn 1>
</cffunction>
</cfcomponent>
Hope this helps.
Curt Gratz
Computer Know How
Coldbox Alliance Partner