在javascript中以base64字符串转换图像？

Question

i have html form with ENCTYPE="multipart/form-data" .It just contains the textbox of type 'file' which browses the file from local box.Here is the textbox code snippet

<td>
    <input name="fileNameAttr" id="filePath" size="52" type="file" value="">
</td>

I browse the file some image file from local box. The moment i select the file, filePath gets populated in text box. Now on click of some button, i want to convert the image in to base64 String in javascript. I am not using HTML5. Can i achieve it in javascript?

i can see some solution on net using HTML5 but that does not solve my purpose. If i need to use some third party utility , i can do that.

EDIT:- looks like jquery can help with $.base64.encode( "this is a test" ); but how to use it with type="file"?

Answer 1

this can be done by the HTML5 <canvas> for it

or

if you have node.js as an option then try something like that in img

or <img src="data:image/png;base64,jkasfhsdjkhsadf" />

example

var fs = require('fs');
var base64_data = new Buffer(fs.readFileSync('sample.png')).toString('base64');
console.log('<img alt="sample" src="data:image/png;base64,' + base64_data + '">');

check this (also source of example)

Data URI scheme

Good read

1. How can you encode to Base64 using Javascript? //its for image

Answer 2

If you could access the local filesystem via javascript, what would keep you from reading the password file or other private data?

This you can't do and it can't and won't be allowed in the future, for obvious reasons!