web-dev-qa-db-ja.com

python）を使用して画像をhtmlに出力します

pythonから生成された、正常に機能するWebページがあります。

print 'Content-type: text/html\n\n'
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/png\n\n" + file("11.png","rb").read() )
print 'Content-type: text/html\n\n'
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'>"

ブラウザで壊れた画像が表示され、画像に直接アクセスすると、Apacheログに次のような500内部サーバーエラーが発生します。

8)Exec format error: exec of './../../11.png' failed Premature end of script headers: 11.png
pythonhtmlhttp-headerscgi
13
Kilizo

このコードを使用して、画像をHTMLに直接埋め込むことができます：Python 3

import base64
data_uri = base64.b64encode(open('Graph.png', 'rb').read()).decode('utf-8')
img_tag = '<img src="data:image/png;base64,{0}">'.format(data_uri)
print(img_tag)

Python 2.7

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 <2.6：

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)
46
Glider

そのような同じドキュメントにHTMLと画像を混在させることはできません。使用 <img>タグを使用してHTMLに画像を埋め込みます。

2
David Heffernan

Webページの画像は通常、サーバーへの2番目のリクエストです。 HTMLページ自体には画像がなく、<img src='the_url_to_the_image'>のような画像への参照だけです。次に、ブラウザはサーバーに2番目の要求を行い、画像データを取得します。

画像とHTMLを一緒に提供する必要がある唯一のオプションは、imgタグでdata:URLを使用することです。

2
Ned Batchelder

画像データをHTMLにダンプするだけでは不十分です。

ファイルを提供してリンクするか、base64でエンコードされた画像を埋め込む必要があります。

1
Acorn