javaweb upload file
Part of the jsp of the uploaded file
To upload files, you can also use the form to send a request to the backend, or use ajax to send a request to the backend
1. Send a request to the backend through the form
<form id="postForm" action="${pageContext.request.contextPath}/UploadServlet" method="post" enctype="multipart/form-data">
<div class="bbxx wrap">
<input type="text" id="side-profile-name" name="username" class="form-control">
<input type="file" id="example-file-input" name="avatar">
<button type="submit" class="btn btn-effect-ripple btn-primary">Save</button>
</div>
</form>
The improved code does not require form tags and is implemented directly by the control. Developers only need to focus on business logic. JS has closed it for us
The data submitted by the control can be seen through the monitoring tool, which is very clear and debugging is also very simple.
2. Send a request to the backend via ajax
1.
$.ajax({
url : "${pageContext.request.contextPath}/UploadServlet",
type : "POST",
data : $( '#postForm').serialize(),
success : function(data) {
$( '#serverResponse').html(data);
},
error : function(data) {
$( '#serverResponse').html(data.status + " : " + data.statusText + " : " + data.responseText);
}
});
Ajax is divided into two parts, one part is initialization, and the file is notified to the server through AJAX request for initialization before uploading
Send a notification to the server after the file is uploaded
Here needs to deal with the logic of MD5 second transmission. When the same file exists on the server, the user does not need to upload again, but directly informs the user of the second transmission
Here you can see that the logic of the second pass is very simple, not particularly complicated.
var form = new FormData ();
form.append("username","zxj");
form.append("avatar",file);
//var form = new FormData($("#postForm")[0]);
$.ajax({
url:"${pageContext.request.contextPath}/UploadServlet",
type:"post",
data:form,
processData:false,
contentType:false,
success:function(data){
console.log(data);
}
});
java part
File initialization logic
Receive file block data, in this logic we receive file block data. The control has optimized the data to facilitate debugging. If you use monitoring tools, you can see the data submitted by the control.
Note:
1. The above java code can be used directly, just need to upload the image path and collect data and write the data to the database.
2. The byte stream is used for uploading files above, but other streams can also be used. This requires the reader to complete the test below.
3. BeanUtils is a tool for assigning the corresponding attributes of the entity to the entity
4. The uploaded file cannot use request.getParameter("") to get the parameters, but directly parse the request, by judging whether each item is a file or a non-file, and then perform the corresponding operation (the file is read by stream, If it is not a file, temporarily save it in a map.)
Most of the back-end code logic is the same, and it currently supports MySQL, Oracle, and SQL. You need to configure the database before use, you can refer to this article I wrote: http://blog.ncmem.com/wordpress/2019/08/12/java-http%E5%A4%A7%E6%96%87 %E4%BB%B6%E6%96%AD%E7%82%B9%E7%BB%AD%E4%BC%A0%E4%B8%8A%E4%BC%A0/
Welcome to join the group to discuss together: 374992201