Sending Audio File/blob From Ui To Servlet For Saving At Server.

We are trying to send our Audio file from the UI side using following code var url = (window.URL || window.webkitURL).createObjectURL(blob); var link = document.getElementById('sa

Solution 1:

Good day

You can use a plugin fileupload

https://github.com/blueimp/jQuery-File-Upload

There is quite full instruction how to use it with spring and ajax:

http://krams915.blogspot.ru/2012/06/file-upload-with-spring-and-jquery-part_2793.html (from wiki of this plugin)

Quick tutorial (don't forget to include the plugin) Html code:

<label>Name</label>
    <form name="fileupload" method="POST" class="newSongUpload" action="upload.new.song"id="uploadNewFile">
    <!--in action - your url --!>
                    <input type="text" name="songName">
                        <i class="glyphicon glyphicon-plus"></i>
                            <input type="file" name="files"id="upload-new-document" accept="your accept here">


         </form>
</div>   

JS code:

$(function () {
            $('.newSongUpload').fileupload({
                multipart: true,
                dataType: 'json'//actually this enough to get plugin works//You can write what will happen after loading in done:yourcode and what you accept in accept:your types
            })
        });

Java spring code:

@RequestMapping(value = {"/upload.new.song"}, method = RequestMethod.POST)
public @ResponseBody HashMap<String, String> uploadNewSong(HttpServletResponse response,
                                 @RequestParam("file") MultipartFile file){
//Your code with file here you can save it to the database or to file system with file.getBytes() function
}

I hope it'll help you

Solution 2:

If you want to process the uploaded files in Servlet, files should be sent as request attribute of "multipart/form-data" and it should be POST method

Please refer the example provided by Oracle.

Reference :http://docs.oracle.com/javaee/6/tutorial/doc/glraq.html