CODEWITHSUNDEEP
javascriptjqueryimagehtmlblob
Eldon Lesley
Eldon Lesley

Reputation: 925

jQuery/JavaScript read image/files from path file

I have a reference how to load an image from a file:

http://jsfiddle.net/eD2Ez/31/

but I don't know how to manually load the image by inputting or giving a string parameter that contains path file (e.g. C:\myImage\img12.jpg)

in the link, the image is directly load from the file dialog.

Upvotes: 0

Views: 13232

Answers (2)

Sev
Sev

Reputation: 1992

Indeed, to my knowledge there is no established or even mildly known way to load local files programmatically due to security policies.

Aside from that you may want to use the onload handler on img to be sure that the image is loaded when you draw it on canvas. At the moment in some cases where the image is too big or the computer is slow you may not get the image rendered.

Check demo: http://jsfiddle.net/eD2Ez/38/

Experimental / Future

However, there could be a light on the horizon. There is something called FileSystem API in the works but didn't work for me (although it should).

Firstly the FileSystem API is currently implemented under vendor prefix on Chrome version 21+.

Also you have to use the flag --allow-file-access-from-files when you launch Chrome.

But even with all this, I still didn't manage to make it happen with Chrome v21 and still get SECURITY_ERR.

Check the "demo": http://jsfiddle.net/MQFGd/2/

Sources:

Upvotes: 2

Anton
Anton

Reputation: 32581

   $('<img src="'+img.src+'"/>').insertAfter('#cvs');

Here is demo http://jsfiddle.net/eD2Ez/32/

Upvotes: 0

Related Questions