I want to get a file (image or video) from an

<input type='file' id='file_i'/>
// Not this <input type='submit'/>

Using an XMLHttpRequest like this

function img() {
            var fd = new FormData();
            fd.append('file', document.getElementById("file_i").files[0]);
            var req;
            if (window.ActiveXObject) {
                req=new ActiveXObject();
            } else {
                req=new XMLHttpRequest();
            }
            req.open("post", "Image", true);
            req.send(fd);
        }

for example.
Then in the servlet doing this:

new FileInputStream(new File(request.getParameter("file")))

How can I retrieve that file? Thanks in advance.

I want to get a file (image or video) from an

<input type='file' id='file_i'/>
// Not this <input type='submit'/>

Using an XMLHttpRequest like this

function img() {
            var fd = new FormData();
            fd.append('file', document.getElementById("file_i").files[0]);
            var req;
            if (window.ActiveXObject) {
                req=new ActiveXObject();
            } else {
                req=new XMLHttpRequest();
            }
            req.open("post", "Image", true);
            req.send(fd);
        }

for example.
Then in the servlet doing this:

new FileInputStream(new File(request.getParameter("file")))

How can I retrieve that file? Thanks in advance.

• javascript
• java
• html
• xmlhttprequest

• Possible duplicate of: How to upload files to server using JSP/Servlet? – DJDaveMark Commented Feb 7, 2018 at 12:56
• Possible duplicate of: Simulate file form submission with XMLHttpRequest Level 2 – DJDaveMark Commented Feb 7, 2018 at 13:00
• Those two links should answer your question – DJDaveMark Commented Feb 7, 2018 at 13:01
• If you answer my question giving me the javascript, html & java sample code for it, it would be greatly appreciated as it doesn't seem to be working for me – MBJH Commented Feb 7, 2018 at 18:18
• What Java techno are you using server-side? Plain servlets? JAX-RS? SpringMVC? Are you using an ORM? Hibernate? JPA? or JDBC straight to which DB? MySQL? PostgreSQL? Also can you use jQuery client-side? – DJDaveMark Commented Feb 7, 2018 at 20:46

2 Answers 2

I fixed it. Here it is:

JAVASCRIPT

var fd = new FormData();
fd.append('file', document.getElementById("file_i").files[0]);
var req;
if (window.ActiveXObject) {
    req=new ActiveXObject();
} else {
    req=new XMLHttpRequest();
}
req.open("post", "Image", true);
req.send(fd);

JAVA

@MultipartConfig
public class addImage extends HttpServlet {
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws IOException, ServletException {
        Part filePart = request.getPart("file");
        InputStream fileContent = filePart.getInputStream();
}
}

XML

<servlet>
        <servlet-name>Add Image</servlet-name>
        <servlet-class>servlets.addImage</servlet-class>
</servlet>
<servlet-mapping>
    <servlet-name>Add Image</servlet-name>
    <url-pattern>/Image</url-pattern>
</servlet-mapping>

I think you miss some points.

1. It seems in your JavaScript code, that you just create the request. But you didn't respond to results.

   req.addEventListener("load", reqListener);
   

   You should define reqListener like that:

   function reqListener () {
       // Here try to handle the response text, using "this.responseText"
       console.log(this.responseText);
   }
   

   See the full info here: Using XMLHttpRequest

2. Also in your Java code, you just stated that you created a file stream. You should read from this input stream into the request's output stream. Also you should set the header Content-Type: put_your_mime_type_here, For example: Content-Type: application/json, if your file is a json file, Content-Type: image/png, if your file is a PNG image.

   See an example here: Example for making a file download URL in Java