Вывод изображений в html с помощью python

у меня есть веб-страница, сгенерированная из python, которая работает так, как должна, используя:

print 'Content-type: text/htmlnn'
print  ""                                 # blank line, end of headers
print '<link href="default.css" rel="stylesheet" type="text/css" />'
print "<html><head>"

Я хочу добавить изображения на эту веб-страницу, но когда я это сделаю:

sys.stdout.write( "Content-type: image/pngnn" + file("11.png","rb").read() )
print 'Content-type: text/htmlnn'
print  ""                                 # blank line, end of headers
print '<link href="default.css" rel="stylesheet" type="text/css" />'
...

все, что я получаю, это изображение, то если я помещаю код изображения под моим заголовком html / text, Все, что я получаю, это текст из изображения, т. е.:

<Ï#·öÐδÝZºm]¾|‰k×®]žòåËÛ¶ÃgžyFK–,ÑôéÓU½zuIÒ}÷ݧ&MšH’V¯^­?üð¼1±±±zýõ×%IñññÚºu«*W®¬wß}W.—K3gÎÔÌ™ÿw‹Ú””I’¹w¤¥hdÒd½q÷X•Šˆ²m¿þfïÞ½*]º´éÈs;¥¤¤Ø¿ILLÔˆ#rÊ

кроме того, если я попробую:

print "<img src='11.png'>"

я получаю сломанное изображение в браузере, и просмотр непосредственно изображения приводит к ошибке внутреннего сервера 500, с моим журналом apache, говорящим:

8)Exec format error: exec of './../../11.png' failed Premature end of script headers: 11.png
10
cgi html http-headers python

4 ответов

вы можете использовать этот код для прямого встраивания изображения в HTML:

data_uri = open('11.png', 'rb').read().encode('base64').replace('\n', '')
img_tag = '<img src="data:image/png;base64,{0}">'.format(data_uri)

print(img_tag)

альтернативно для Python 

data_uri = open('11.png', 'rb').read().encode('base64').replace('\n', '')
img_tag = '<img src="data:image/png;base64,%s">' % data_uri

print(img_tag)

для python > 3 заменить первую строку на

data_uri = base64.b64encode(open('Graph.png', 'rb').read()).decode('utf-8').replace('\n', '')
37

изображения на веб-страницах обычно являются вторым запросом на сервер. На самой HTML-странице нет изображений, просто ссылки на такие изображения, как <img src='the_url_to_the_image'>. Затем браузер делает второй запрос на сервер и получает данные изображения.

единственный вариант, который вы должны обслуживать изображения и HTML вместе, это использовать data: url в img тег.

2

вы не можете смешивать HTML и изображение в одном документе. Используйте <img> тег для вставки изображений в HTML.

2

вы не можете просто сбрасывать данные изображения в HTML.

вам нужно либо иметь файл и ссылку на него, либо встроить изображение, закодированное в base64.

1