我正在尝试集成/ jQuery-File-Upload插件，以便在AWS s3中上传文件。直到现在我成功通过此插件将文件上传到S3。但是在将文件上传到S3时，此插件没有显示进度条或准确，它直接显示100％以及文件大小（例如）128kb / 128kb。 我正在使用servlet（用于s3上传过程）和html（临时作为接口）。 这是我的servlet ::
/**
* Servlet implementation class UploadCon
*/
@WebServlet("/UploadCon1")
@MultipartConfig
public class UploadCon1 extends HttpServlet {
private static final long serialVersionUID = 1L;
/**
* @see HttpServlet#HttpServlet()
*/
public UploadCon1() {
super();
// TODO Auto-generated constructor stub
}
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
}
/**
* @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
*/
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
// TODO Auto-generated method stub
String bucketName = "thehexa4";
String uploadFileName="";
AmazonS3 s3client = new AmazonS3Client(new ProfileCredentialsProvider());
try {
for(Part filePart : request.getParts()){
if(!filePart.getSubmittedFileName().isEmpty()){
String fileName = filePart.getSubmittedFileName();
InputStream fileContent = filePart.getInputStream();
System.out.println("filePart :: "+filePart);
System.out.println("file Name :: "+fileName);
System.out.println("Uploading a new object to S3 from a file\n");
ObjectMetadata meta = new ObjectMetadata();
meta.setContentLength(filePart.getSize());
meta.setContentType("image/jpg");
s3client.putObject(bucketName, fileName, fileContent, meta);
//JSON metadata transfer
PrintWriter writer = response.getWriter();
response.setContentType("application/json");
JSONArray json = new JSONArray();
try {
String fileUploadPath = "https://"+bucketName+".s3.amazonaws.com/"+fileName;
JSONObject jsono = new JSONObject();
jsono.put("name", filePart.getSubmittedFileName());
jsono.put("size", filePart.getSize());
jsono.put("url", fileUploadPath);
// jsono.put("thumbnail_url", fileUploadPath);
jsono.put("delete_url", fileUploadPath);
jsono.put("delete_type", "GET");
json.put(jsono);
} catch (Exception e) {
throw new RuntimeException(e);
} finally {
writer.write(json.toString());
writer.close();
}
}
//JSON transfer ends
}
}catch (AmazonServiceException ase) {
System.out.println("Caught an AmazonServiceException, which " +
"means your request made it " +
"to Amazon S3, but was rejected with an error response" +
" for some reason.");
System.out.println("Error Message: " + ase.getMessage());
System.out.println("HTTP Status Code: " + ase.getStatusCode());
System.out.println("AWS Error Code: " + ase.getErrorCode());
System.out.println("Error Type: " + ase.getErrorType());
System.out.println("Request ID: " + ase.getRequestId());
} catch (AmazonClientException ace) {
System.out.println("Caught an AmazonClientException, which " +
"means the client encountered " +
"an internal error while trying to " +
"communicate with S3, " +
"such as not being able to access the network.");
System.out.println("Error Message: " + ace.getMessage());
}
//code ends
}
}
这是html：[我没有改变原始插件html中除了form action =“/ UploadCon1”和必要的js-css文件路径，所以我只显示了我的html文件的表单部分]
<!-- The file upload form used as target for the file upload widget -->
<form id="fileupload" action="UploadCon1" method="POST" enctype="multipart/form-data">
<!-- The fileupload-buttonbar contains buttons to add/delete files and start/cancel the upload -->
<div class="row fileupload-buttonbar">
<div class="span7">
<!-- The fileinput-button span is used to style the file input field as button -->
<span class="btn btn-success fileinput-button">
<i class="icon-plus icon-white"></i>
<span>Add files...</span>
<input type="file" name="files[]" multiple>
</span>
<button type="submit" class="btn btn-primary start">
<i class="icon-upload icon-white"></i>
<span>Start upload</span>
</button>
<button type="reset" class="btn btn-warning cancel">
<i class="icon-ban-circle icon-white"></i>
<span>Cancel upload</span>
</button>
<button type="button" class="btn btn-danger delete">
<i class="icon-trash icon-white"></i>
<span>Delete</span>
</button>
<input type="checkbox" class="toggle">
</div>
<!-- The global progress information -->
<div class="span5 fileupload-progress fade" >
<!-- The global progress bar -->
<div class="progress progress-success progress-striped active" role="progressbar" aria-valuemin="0" aria-valuemax="100">
<div class="bar" style="width:0%;"></div>
</div>
<!-- The extended global progress information -->
<div class="progress-extended"> </div>
</div>
</div>
<!-- The loading indicator is shown during file processing -->
<div class="fileupload-loading"></div>
<br>
<!-- The table listing the files available for upload/download -->
<table role="presentation" class="table table-striped"><tbody class="files" data-toggle="modal-gallery" data-target="#modal-gallery"></tbody></table>
</form>
任何人都可以帮忙吗？ 提前致谢。 ：）