简体   繁体   中英

Upload picture and send it to server(AngularJS & Jersey)

I have form with fields:

<div class="form-group">
    <label>Email Address</label> 
    <input type="email" ng-model="email" class="form-control">
</div>
<div class="from-group">
    <label>Photo</label>: 
<input type="file" ngf-select ng-model="picFile" name="file" accept="image/*" ngf-max-size="2MB" required>
</div>
<div class="form-group">
    <input ng-click="uploadPic(picFile)" type="submit"  class="btn btn-lg btn-default pull-right btn-block"value="Register">
</div>

And in controller(using ng-file-upload):

$scope.uploadPic = 
    function(file) {
        console.log('Uploading image...');
        Upload.upload({
            url : 'upload',
            data : {
            email : $scope.email,
            file : file
    })};

I don't know how can I receive this kind of object in server. I tried something like this:

@POST
@Path("/upload")
@Produces(MediaType.MULTIPART_FORM_DATA)
public void upload(@FormDataParam("file") InputStream fileIputStream,
            @FormDataParam("email") String email) {}

But I think problem is in InputStream, because sent object is different type? If code on client side is valid how to receive and save image on server? One more time, app is developed using AngularJS on client and Jersey on server side.

Solution, I think:

First download:

  1. jersey-media-multipart-2.17.jar
  2. mimepull-1.9.3.jar

Then add:

<init-param>
        <param-name>jersey.config.server.provider.classnames</param-name>
        <param-value>org.glassfish.jersey.filter.LoggingFilter;
        org.glassfish.jersey.media.multipart.MultiPartFeature</param-value>
</init-param>

into web.xml file, inside <servlet> .

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM