如何在瀏覽器中將png數據顯示爲圖像？

這裏的數據的摘錄：如何在瀏覽器中將png數據顯示爲圖像？

\ x89PNG \ r \ n \ X1A \ n \ X00 \ X00 \ X00 \ rIHDR \ X00 \ X00 \ x01J \ X00 \ X00 \ X00 \ XA0 \ B \ x02 \ x00 \ x00 \ x00 \ x02 \ x00 \ x00 \ x00 \ xzzTXtRaw 配置文件類型 exif \ x00 \ x00x \ xDAU \ x8E [\ n \ xC40 \ bE \ xFF] \ xC5，\ xC1W4'\ X94 \ X06 \ XBA \ X83 \ 0x7F部分\ x94d \ xE8 \ XF4 |。\ xE8 \ xE5 \「\ A \ XE1 \命苦\ XAF \ t \ x9F \ X82 \ x90A \ x9Bw \ v3L44xd \ xE8 \ XB8 \ x10Db \ XA4 \ xDA9 \ X17 {\已經\ XE2 \ XA7 \ X06 \ XE1 \ X15，\ XBA \ XA3> \的x87 \ XBA \ XFB \ x1FM \ XAC \ xDBtu \ xB7f \的x87 \ X1D \ x9Cv> \ X85 \ XA4 \ xE5，QY \ XB1 \ XDE \ X88 \ xC9 \ xD8I \ XDE \ xFDx \ XBB \ X11 \ xBEK \ X01，TP;噸\ XCD \ X00 \ X00 \噸\ xECiTXtXML：com.adobe.xmp \ x00 \ x00 \ x00 \ x00 \ x00 \ n \ n http://www.w3.org/1999/02/22-rdf-syntax-ns#\"> \ n xmlns：exif = \「 http://ns.adobe.com/exif/1.0/\ 「\ n
的xmlns：TIFF = \」 http://ns.adobe.com/tiff/1.0/\ 「\ n
EXIF：PixelXDimension = \」 330 \ 「\ n EXIF：PixelYDimension = \」 160 \ 「\ n
TIFF：ImageWidth = \」 1 \ 「\ n TIFF：ImageHeight = \」 160 \「/> \ n \ n \ n
\ n \ XFA \ XA4 \

我不知道我需要做的，它顯示它在瀏覽器中。它的格式不正確，但我對圖像格式不瞭解。我相信我只需要將它轉換成某種東西。

這樣做：

<img src="<%= **the above data** %>" />

不起作用：

the image not working

那麼我需要做的這個數據，使其顯示？我在rails上使用ruby，所有的方法都可以使用。

該數據通過read方法捕獲。

來源

2014-03-28 Starkers

在HTML頁面預期的格式是

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

哪裏???是圖像文件的內容轉換爲底部64

您應該使用幫助編碼64鹼基

require "base64" 
... 
def encode_image_b64(raw_image) 
    Base64.strict_encode64(raw_image) 
end

而在ERB文件：

<img src="data:image/png;base64,<%= encode_image_b64(**image data**) %>" />

你可以找到更多的信息，數據URI的利弊，並在Wikipedia一個Ruby的例子。要做到這一點

來源

2014-03-28 16:01:45 Baldrick

狡猾的計劃確實... – Starkers

你可以這樣做：

<img src="data:image/png;base64,your image data here"/>

來源

2014-03-28 15:59:23

這個答案几乎是以前的答案的副本，但這個答案有更少的信息。新答案應該增加額外的有用信息或替代方法，而不僅僅是複製其他答案。 – AdrianHHH

??? Adrian HHH，我在兩分鐘之前發佈了我的答案。檢查時間戳。 –

的方法之一，是通過執行以下操作：在視圖

<img src="/get_img/tlotr">

這將使服務器的請求，所以在路線。RB添加

get '/get_img/:filename' => 'test#img'

在我來說，我有行動呼籲IMG一個類似的TestController：

def img 
    send_file("/your_path/#{params[:filename]}.png", 
    :disposition => 'inline', 
    :type => 'image/png', 
    :x_sendfile => true) 
end

有了這個解決方案，您打一次服務器，但你不必送數據使用讀取方法。

來源

2014-03-28 16:04:58 VAIRIX

如何在瀏覽器中將png數據顯示爲圖像？

回答

相關問題