Hi Ruchira, Managed to get it worked using the [2] library you suggested.Thanks for the help :-)
Regards, Supun On Thu, May 7, 2015 at 12:23 PM, Supun Sethunga <[email protected]> wrote: > Hi Ruchira, > > Thanks for the quick response. The reason for going for JavaScript was, > the backend is secured with Basic Auth, and AFAIK there is no way to set > security headers to the html form submission request. > > Will try out the suggested libraries. > > Thanks, > Supun > > On Thu, May 7, 2015 at 12:08 PM, Ruchira Wageesha <[email protected]> > wrote: > >> Hi Supun, >> >> First of all it has nothing to do with Jaggery. i.e. Jaggery is a server >> side framework and what you do here is sending a file from your browser to >> a JAX-RS backend. >> >> When you upload binaries from a browser, most probably you will have to >> post it with multipart content type. For that, the simplest approach is to >> use an HTML form with multipart type and just submit the form. In this case >> browser will do the HTTP post, but not you JavaScript code. >> >> Else, you can use a client side JavaScript library which does file >> uploading such as [1] or [2](this is used in ES as well). But if you don't >> have any specific requirement to go with JavaScript, then just go with the >> HTML form. >> >> /Ruchira >> >> [1] https://blueimp.github.io/jQuery-File-Upload >> [2] http://malsup.com/jquery/form/#file-upload >> >> On Thu, Apr 23, 2015 at 5:20 PM, Supun Sethunga <[email protected]> wrote: >> >>> Hi, >>> >>> Requirement was to let a user upload a data file from a UI >>> (html/jaggery), and the backend which handles file uploading is exposed as >>> a REST service. Backend service method I wrote looks as follows: >>> >>> @POST >>>> @Produces(MediaType.APPLICATION_JSON) >>>> @Consumes(MediaType.MULTIPART_FORM_DATA) >>>> public Response uploadDataset(@Multipart("datasetName") String >>>> datasetName, >>>> @Multipart("version") String version, >>>> @Multipart("description") String >>>> description, >>>> @Multipart("sourceType") String >>>> sourceType, >>>> @Multipart("destination") String >>>> destination, >>>> @Multipart("sourcePath") String >>>> sourcePath, >>>> @Multipart("dataFormat") String >>>> dataFormat, >>>> @Multipart("file") InputStream >>>> inputStream) { >>>> . . . >>>> . . . >>>> } >>> >>> >>> The InputStream is then written to a file at the server side. This >>> method works fine when I call this with CURL using: >>> >>> *curl -X POST -b cookies http://localhost:9763/api/datasets >>>> <http://localhost:9763/api/datasets> -H "Authorization: Basic >>>> YWRtaW46YWRtaW4=" -H "Content-Type: multipart/form-data" --form >>>> datasetName=TestDataset --form version=1.0.0 --form >>>> description=TestDescription --form sourceType=file --form destination=file >>>> --form dataFormat=CSV --form >>>> file=@/home/supun/Supun/MachineLearning/data/IndiansDiabetes.csv --form >>>> sourcePath=/temp* >>> >>> >>> Also works fine when I used Chrome's REST client. >>> >>> However, when I call the same service, using AJAX, the file is written >>> with empty content. Follow is the sample snippet. >>> >>> >>>> *var formData = new FormData();* >>>> * formData.append("file", fileInput[0]['files'][0], >>>> 'IndiansDiabetes.csv');* >>>> * formData.append("datasetName", name);* >>>> * formData.append("version", version);* >>>> * formData.append("description", comments);* >>>> * formData.append("sourceType", dataSourceType);* >>>> * formData.append("sourcePath", null);* >>>> * formData.append("destination", dataTargetType);** >>>> formData.append("dataFormat", dataType);* >>> >>> >>> >>> >>>> * var baseUrl = getBaseUrl(window.location.href);* >>>> * $.ajax({* >>>> * type: 'POST',* >>>> * url: baseUrl + '/api/datasets', * >>>> * contentType: "multipart/form-data",* >>>> * processData: false,* >>>> * data: formData,** beforeSend : function(xhr) {* >>>> >>>> * xhr.setRequestHeader("Authorization", "Basic " + >>>> "YWRtaW46YWRtaW4=");* >>>> * },* >>>> * success : function(res){* >>>> * console.log('success');* >>>> * },* >>>> * error : function(res){* >>>> * console.log('failed');* >>>> * } * >>>> * });** })* >>> >>> >>> One thing I noticed was, When calling the service using CURL and >>> REST-Client, the *@Multipart("file") InputStream inputStream* binds to >>> a "LoadingByteArrayOutputStream", but when calling from AJAX (or even with >>> a java client) it binds to a >>> "org.apache.cxf.attachment.DelegatingInputStream", and hence writing an >>> empty content to the server. >>> >>> Any idea on how to overcome this? >>> >>> Thanks, >>> Supun >>> >>> -- >>> *Supun Sethunga* >>> Software Engineer >>> WSO2, Inc. >>> http://wso2.com/ >>> lean | enterprise | middleware >>> Mobile : +94 716546324 >>> >>> _______________________________________________ >>> Dev mailing list >>> [email protected] >>> http://wso2.org/cgi-bin/mailman/listinfo/dev >>> >>> >> >> >> -- >> >> *Ruchira Wageesha**Technical Lead* >> *WSO2 Inc. - lean . enterprise . middleware | wso2.com <http://wso2.com>* >> >> *email: [email protected] <[email protected]>, blog: >> ruchirawageesha.blogspot.com <http://ruchirawageesha.blogspot.com>, >> mobile: +94 77 5493444 <%2B94%2077%205493444>* >> > > > > -- > *Supun Sethunga* > Software Engineer > WSO2, Inc. > http://wso2.com/ > lean | enterprise | middleware > Mobile : +94 716546324 > -- *Supun Sethunga* Software Engineer WSO2, Inc. http://wso2.com/ lean | enterprise | middleware Mobile : +94 716546324
_______________________________________________ Dev mailing list [email protected] http://wso2.org/cgi-bin/mailman/listinfo/dev
