Display image created using chunkypng directly (without saving)

Question

so I created a PNG image using chunky_png . I do not want to save this image because it is useful only for this single request, so I am trying to save this image as an instance variable and display it in my view.

the problem is that this leads to an invalid byte sequence in UTF-8 error in my view.

What I've done:

 # controller @img = source_img.resize(200, 200).to_string #view <img src="data:image/png;base64,<%= @img %>" /> 

debugging the @img variable with raise @img.to_yaml me the correct line, fe:

 --- !binary |- iVBORw0KGgoAAAANSUhEUgAAAMgAAADIAQAAAACFI5MzAAACP0lEQVR4nO1Y QY6jQAy0AxJ9a34AH8l29lmRhgDJSDxrwsxHmh80N5Ag3urkjFZabTw5TJ+g HclWUa6ys5Ots6Ot8xP5/xFhnJIGxo/GdDD9HC+al6iNMpGFVie3kXOiyZET 8bq49cAipRn5bVXOB+CVPiXPXyMRhQb1PDvPRmQZAMWOam/cN1TgpKFEyIVT pENLDF6oVoCuSCkdSIokEJnICy41K+AojX4psutY5+8011m80O1T4YpXxsOJ 3mjqo2A8Jc+/RD7txVNhWFrJPDnTF41uBfPvoXKJHw/jjt7QLMThqKuj2Ufe +bUEFDeigtykr1UsVQkT2TP0cjA0H6wuR4VPkKilmMCDACjISmhLXc/64Ap+ mp3RJZ3IFTVpe9aXXHxawKzOY/Ss8WCVHX2u7hjYNa/yxNsWSrEULzJT0Cd1 XgToXEDWx/WgWRtPHKkZGSJ86ccDHjqvy9E1ryHfKORkmwJ+5u7NoqoUoXXQ axqTYS6Ng2jWukoBD6/7qI+2sc2AmUIKLnUxkHzFMDURVXdHx3hT97pd8hU6 v9B8Ghs0qOnhIO9PybMZQRuumKTM42Ii3o2zew2lYLnBvRKP9ryErjeEd10/ fexmaznti8ZWbopoJV5XKeIGJp6TUEEyDGVXZbV8bGCMqRPbTyQnlpDjNzAk gZXbNhxLINKH5+XZjsxsJD8DAwjGPtf+CnEDI8xVIX4HQ4aDtlLEDSzx5hdk M77FuUp5/9mKPHazu5LX97+wMH42qhX8RP4AQpEyh+7r4x0AAAAASUVORK5C YII= 

manually copying this line to the img tag displays the image correctly.

any ideas what is going wrong here? other ideas of displaying this image directly without saving?

Thanks in advance! if something is unclear, PLEASE leave a comment.

Answer 1

ChunkyPNG actually comes with a built-in function to do just that: to_data_url .

 # controller @img = source_img.resize(200, 200) # view <img src="<%= @img.to_data_url %>" /> 

It is implemented as follows:

 ['data:image/png;base64,', @img.to_blob].pack('A*m').gsub(/\n/, '') 

Make sure you are using the latest version of ChunkyPNG.

Answer 2

The @wvanbergen path gave me some errors, but I changed a bit and it worked.

  #controller @png = qr.to_img.resize(250,250).to_data_url #view <%= image_tag @png %>