Using Javascript Image object to handle images

Question

I need to preview an image using javascript before upload to provide a crop facility. For this purpose, I create an Image object in javascript.

var image = new Image();

To confine big images to a limited space, I access the height and width of the image using image.width and image.height

For some of the images, I find that this value is shown as zero and for which when I inspected the image object, found that image.mimeType has the value Unspecified Error (Even the file creationdate shows unspecified error).

As such I am not able to preview those images. How do I solve the problem?

Answer 1

You won't be able to get a preview of image from the client system. You have to upload the image to a server and can show the image preview from there.

Reading files from the client system is a security threat and most browsers won't allow that. In earlier versions of IE you can get that, but won't be available in newer versions and other browsers.