0

Why the data captured from the webcam gets modified if i put it in an image field:

a = canvas.toDataURL("image/jpeg")
document.getElementById("avatar").src = a

src will be corrupted and will show only blank file, but when accessing to canvas.toDataURL("image/jpeg") in console, i get healthy' image.

using:

document.getElementById("avatar").src

"data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAAMCAgICAgMCAgIDAwMD…gAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooAKKKKACiiigAooooA//Z"

But:

a = canvas.toDataURL("image/jpeg")

"data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAAMCAgICAgMCAgIDAwMD…vtP7ypIi8kA5zUDTCJSDyw7kUrOjzF0dmAOADSTFpJTJM49TxyaG3e0np6joNx0lHTp1+fY//Z"

the code is here

Community
  • 1
  • 1
Abdelouahab Pp
  • 4,252
  • 11
  • 42
  • 65
  • 1
    `toDataURL` will return the same encoded string as long as the canvas has not changed. Are you constantly updating the canvas? Is the encoded string actually corrupted? You can put it in the address bar and modern browsers will display the image. – approxiblue Jul 01 '13 at 00:15
  • 1
    What browser is this? Have you tried with the PNG format instead of JPEG? How do you update the canvas (code)? Also remember that setting the `src` attribute of an image is an asynchronous operation. –  Jul 01 '13 at 01:24
  • @deshko the canvas is constant, since i get the picture from the webcam. @Ken-AbdiasSoftware `Chrome 27.0.1453.110` and that's the problem for both png (default) and jpeg – Abdelouahab Pp Jul 01 '13 at 07:39
  • 1
    Do you get the picture from the webcam once or periodically? Do you refresh it? If so, you should disable that. Get just one picture for testing. Did you open the data URL in the browser? – approxiblue Jul 01 '13 at 12:39
  • @deshko no, the picture is token once, it is to use it as a profile picture – Abdelouahab Pp Jul 01 '13 at 19:29
  • 1
    I checked out your code in the other question. It works fine (Firefox). Did you end your `toDataURL` line with a semi-colon? – approxiblue Jul 02 '13 at 04:02
  • @deshko i thought the semi-colon is only used to separate if i want to compress (uglify) the code^ – Abdelouahab Pp Jul 02 '13 at 19:49
  • 1
    Yes, but using it is recommended (http://stackoverflow.com/questions/444080/do-you-recommend-using-semicolons-after-every-statement-in-javascript). Your code works for me. Do you have a running example somewhere? – approxiblue Jul 03 '13 at 13:42
  • @deshko nope, even with ; it will get a black picture, if it was the ; the code will not run at all since it will not know where is the end of the instruction – Abdelouahab Pp Jul 03 '13 at 21:40

0 Answers0