Member Avatar for ajithraj

haii ..
how can i read an image using javascript...

  • 3 Contributors
  • 5 Replies
  • 83 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by ajithraj

Dani AI

Generated

Short answer: you cannot make browser JavaScript read arbitrary files from a user’s disk without the user explicitly selecting them. was correct on that point. Modern, safe workflows use an <input type="file"> or drag-and-drop; the selected files are exposed to scripts via the File API and can be previewed with FileReader. To upload, send the chosen input.files[0] using FormData and fetch or XHR (FormData.append('file', file)), and use XHR upload events for progress reporting (XMLHttpRequest.upload).

On the server side, manual parsing of multipart streams is fragile and easy to get wrong (binary corruption, boundary handling, charset issues). It’s better to use a tested multipart parser such as Apache Commons FileUpload or the servlet container’s built-in multipart support. Always validate content on the server: check size and MIME type, sanitize and avoid using client paths as filenames, generate safe unique names, store uploads outside the web root, and consider antivirus scanning. OWASP’s guidance on file-upload risks is a good reference: Unrestricted File Upload.

A practical workflow: user selects file → client shows preview with FileReader → client uploads with FormData + fetch/XHR (progress) → server parses with a library, validates, stores safely and returns a JSON result. This avoids the pitfalls of hand-parsing binary uploads and addresses the original goal discussed by and .

Recommended Answers

All 5 Replies

Member Avatar for Luckychap

No way to do that with javascript.

Member Avatar for ajithraj

Can anyone know how the images in our system is uploaded into a mail..... It is done by reading the image from the image location and is uploding..right....????
Is there any way to upload an image from a client system to server....

Member Avatar for tiger86

I am not sure what you mean by read an image. Could you go into further detail?

Member Avatar for ajithraj

This will help to upload an image to the server

<%@ page import="java.io.*" %>

<%
String contentType = request.getContentType();
System.out.println("Content type is :: " +contentType);
if ((contentType != null) && (contentType.indexOf("multipart/form-data") >= 0)) {
DataInputStream in = new DataInputStream(request.getInputStream());
int formDataLength = request.getContentLength();

byte dataBytes[] = new byte[formDataLength];
int byteRead = 0;
int totalBytesRead = 0;
while (totalBytesRead < formDataLength) {
byteRead = in.read(dataBytes, totalBytesRead, formDataLength);
totalBytesRead += byteRead;
}


String file = new String(dataBytes);
String saveFile = file.substring(file.indexOf("filename=\"") + 10);
//out.print("FileName:" + saveFile.toString());
saveFile = saveFile.substring(0, saveFile.indexOf("\n"));
//out.print("FileName:" + saveFile.toString());
saveFile = saveFile.substring(saveFile.lastIndexOf("\\") + 1,saveFile.indexOf("\""));
//out.print("FileName:" + saveFile.toString());

//out.print(dataBytes);

int lastIndex = contentType.lastIndexOf("=");
String boundary = contentType.substring(lastIndex + 1,contentType.length());
//out.println(boundary);
int pos;
pos = file.indexOf("filename=\"");

pos = file.indexOf("\n", pos) + 1;

pos = file.indexOf("\n", pos) + 1;

pos = file.indexOf("\n", pos) + 1;


int boundaryLocation = file.indexOf(boundary, pos) - 4;
int startPos = ((file.substring(0, pos)).getBytes()).length;
int endPos = ((file.substring(0, boundaryLocation)).getBytes()).length;

out.println(boundaryLocation+"pppp"+file.length()+"ooooooooooooo"+(endPos-startPos)+"kkkkk");

saveFile = "/usr/programs/apache-tomcat-6.0.16/webapps/Pinnacle/hr_photoGallery/" + saveFile;
FileOutputStream fileOut = new FileOutputStream(saveFile);


//fileOut.write(dataBytes);
fileOut.write(dataBytes, startPos, file.length());
fileOut.flush();
fileOut.close();

out.println("File saved as " +saveFile);

}
%>
Member Avatar for ajithraj

roblem solved with the above code:cool:

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.