convert image in base64 in flask to Adding in PDF
up vote
2
down vote
favorite
i am going to add image in pdf file using flask. when i add img tag in my html code, it won't appear. how can i add image in my pdf?
i found something like to convert in base64, but i don't know how to do it in python.
below is my flask route code.
@app.route('/pdf')
def pdf_template():
rendered = render_template('pdf_template.html')
css = ['main.css']
pdf = pdfkit.from_string(rendered,False,css=css)
response = make_response(pdf)
response.headers['Content-Type'] = 'application/pdf'
response.headers['Content-Disposition'] = 'inline; filename=output.pdf'
return response
here is my pdf_html file
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<h1>QUOTATION</h1>
<table class="table table-bordered" width='375'>
<tr>
<th>Address</th>
<td>pakistan</td>
</tr>
<tr>
<th>Tel</th>
<td>0213123456</td>
</tr>
<tr>
<th>Mobile</th>
<td>03211234567</td>
</tr>
<tr>
<th>Email</th>
<td>demo@demo.com</td>
</tr>
<tr>
<th>Website</th>
<td>www.example.com</td>
</tr>
</table>
<img src="static/logo.jpg" alt="" width="150" height="150">
<br>
<p class="solid" bgcolor="FFFFFF">Quote To</p>
<br>
<div>
<table class="table table-bordered">
<tbody>
<tr>
<th>OUR REF</th>
<td>{{query1.ourref}}</td>
<th>TO</th>
<td>{{query1.to}}</td>
</tr>
<tr>
<th>DATE</th>
<td>{{query1.date}}</td>
<th>ATTN</th>
<td>{{query1.attn}}</td>
</tr>
<tr>
<th>FROM</th>
<td>{{query1.fromq}}</td>
<th>EMAIL/FAX</th>
<td>{{query1.emailfax}}</td>
</tr>
<tr>
<th>PRC BASIS</th>
<td>{{query1.prcbasis}}</td>
<th>YR REF</th>
<td>{{query1.yrref}}</td>
</tr>
<tr>
<th>LEAD TIME</th>
<td>{{query1.leadtime}}</td>
<th>VALIDITY</th>
<td>{{query1.validity}}</td>
</tr>
<tr>
<th>PAYMENT</th>
<td>{{query1.payment}}</td>
<th>REMARKS</th>
<td>{{query1.remarks}}</td>
</tr>
</tbody>
</table>
</div>
<br>
<table id="itemtable" width="925" id="particular" border="1px solid black" >
<thead>
<tr bgcolor="#FF0000">
<th ><font color="#fff">NO</th>
<th><font color="#fff">PART NAME</th>
<th><font color="#fff">QTY</th>
<th><font color="#fff">U/PRICE</th>
<th><font color="#fff">AMOUNT in RS.</th>
</tr>
</thead>
<tbody>
{% for items in query %}
<tr height="88px" >
<td width="2"0 style="border-top:none; border-bottom:none;">{{items.id}}</td>
<td width="400" style="border-top:none; border-bottom:none;">{{items.itemname}}</td>
<td style="text-align:center; border-top:none; border-bottom:none;" width="100">{{items.qty}}</td>
<td style="text-align:center; border-top:none; border-bottom:none;" width="100">{{items.price}}</td>
<td style="text-align:center; border-top:none; border-bottom:none;" width="150">{{items.qty * items.price}}</td>
</tr>
{% endfor %}
{% for i in range(8 - count) %}
<tr height="95px">
<td width=20></td>
<td width=400></td>
<td style="text-align:center;" width="100"></td>
<td style="text-align:center;" width="100"></td>
<td style="text-align:center;" width="150"></td>
</tr>
{% endfor %}
</tbody>
<tfoot>
<tr bgcolor="#FF0000">
<td style="text-align:center;"></td>
<td style="text-align:right;"colspan="3"><font color="#fff">TOTAL PAK RUPEE.</td>
<td style="text-align:center;" ><font color="#fff">6250</td>
</tr>
</tfoot>
</table>
<p>17%GST EXTRA</p>
<p>PARTIAL ORDER SUBJECT TO OUR CONFIRMATION</p>
<p>THE PRICE MAY CHANGE, IF THE US DOLLAR CONVERSION RATE FLUCTUATES.</p>
<h4 style="float:right;"> <small>For </small>HAMZA ENTERPRISES </h4>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
the pdf is something like this
python-3.x flask base64 python-pdfkit
add a comment |
up vote
2
down vote
favorite
i am going to add image in pdf file using flask. when i add img tag in my html code, it won't appear. how can i add image in my pdf?
i found something like to convert in base64, but i don't know how to do it in python.
below is my flask route code.
@app.route('/pdf')
def pdf_template():
rendered = render_template('pdf_template.html')
css = ['main.css']
pdf = pdfkit.from_string(rendered,False,css=css)
response = make_response(pdf)
response.headers['Content-Type'] = 'application/pdf'
response.headers['Content-Disposition'] = 'inline; filename=output.pdf'
return response
here is my pdf_html file
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<h1>QUOTATION</h1>
<table class="table table-bordered" width='375'>
<tr>
<th>Address</th>
<td>pakistan</td>
</tr>
<tr>
<th>Tel</th>
<td>0213123456</td>
</tr>
<tr>
<th>Mobile</th>
<td>03211234567</td>
</tr>
<tr>
<th>Email</th>
<td>demo@demo.com</td>
</tr>
<tr>
<th>Website</th>
<td>www.example.com</td>
</tr>
</table>
<img src="static/logo.jpg" alt="" width="150" height="150">
<br>
<p class="solid" bgcolor="FFFFFF">Quote To</p>
<br>
<div>
<table class="table table-bordered">
<tbody>
<tr>
<th>OUR REF</th>
<td>{{query1.ourref}}</td>
<th>TO</th>
<td>{{query1.to}}</td>
</tr>
<tr>
<th>DATE</th>
<td>{{query1.date}}</td>
<th>ATTN</th>
<td>{{query1.attn}}</td>
</tr>
<tr>
<th>FROM</th>
<td>{{query1.fromq}}</td>
<th>EMAIL/FAX</th>
<td>{{query1.emailfax}}</td>
</tr>
<tr>
<th>PRC BASIS</th>
<td>{{query1.prcbasis}}</td>
<th>YR REF</th>
<td>{{query1.yrref}}</td>
</tr>
<tr>
<th>LEAD TIME</th>
<td>{{query1.leadtime}}</td>
<th>VALIDITY</th>
<td>{{query1.validity}}</td>
</tr>
<tr>
<th>PAYMENT</th>
<td>{{query1.payment}}</td>
<th>REMARKS</th>
<td>{{query1.remarks}}</td>
</tr>
</tbody>
</table>
</div>
<br>
<table id="itemtable" width="925" id="particular" border="1px solid black" >
<thead>
<tr bgcolor="#FF0000">
<th ><font color="#fff">NO</th>
<th><font color="#fff">PART NAME</th>
<th><font color="#fff">QTY</th>
<th><font color="#fff">U/PRICE</th>
<th><font color="#fff">AMOUNT in RS.</th>
</tr>
</thead>
<tbody>
{% for items in query %}
<tr height="88px" >
<td width="2"0 style="border-top:none; border-bottom:none;">{{items.id}}</td>
<td width="400" style="border-top:none; border-bottom:none;">{{items.itemname}}</td>
<td style="text-align:center; border-top:none; border-bottom:none;" width="100">{{items.qty}}</td>
<td style="text-align:center; border-top:none; border-bottom:none;" width="100">{{items.price}}</td>
<td style="text-align:center; border-top:none; border-bottom:none;" width="150">{{items.qty * items.price}}</td>
</tr>
{% endfor %}
{% for i in range(8 - count) %}
<tr height="95px">
<td width=20></td>
<td width=400></td>
<td style="text-align:center;" width="100"></td>
<td style="text-align:center;" width="100"></td>
<td style="text-align:center;" width="150"></td>
</tr>
{% endfor %}
</tbody>
<tfoot>
<tr bgcolor="#FF0000">
<td style="text-align:center;"></td>
<td style="text-align:right;"colspan="3"><font color="#fff">TOTAL PAK RUPEE.</td>
<td style="text-align:center;" ><font color="#fff">6250</td>
</tr>
</tfoot>
</table>
<p>17%GST EXTRA</p>
<p>PARTIAL ORDER SUBJECT TO OUR CONFIRMATION</p>
<p>THE PRICE MAY CHANGE, IF THE US DOLLAR CONVERSION RATE FLUCTUATES.</p>
<h4 style="float:right;"> <small>For </small>HAMZA ENTERPRISES </h4>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
the pdf is something like this
python-3.x flask base64 python-pdfkit
add a comment |
up vote
2
down vote
favorite
up vote
2
down vote
favorite
i am going to add image in pdf file using flask. when i add img tag in my html code, it won't appear. how can i add image in my pdf?
i found something like to convert in base64, but i don't know how to do it in python.
below is my flask route code.
@app.route('/pdf')
def pdf_template():
rendered = render_template('pdf_template.html')
css = ['main.css']
pdf = pdfkit.from_string(rendered,False,css=css)
response = make_response(pdf)
response.headers['Content-Type'] = 'application/pdf'
response.headers['Content-Disposition'] = 'inline; filename=output.pdf'
return response
here is my pdf_html file
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<h1>QUOTATION</h1>
<table class="table table-bordered" width='375'>
<tr>
<th>Address</th>
<td>pakistan</td>
</tr>
<tr>
<th>Tel</th>
<td>0213123456</td>
</tr>
<tr>
<th>Mobile</th>
<td>03211234567</td>
</tr>
<tr>
<th>Email</th>
<td>demo@demo.com</td>
</tr>
<tr>
<th>Website</th>
<td>www.example.com</td>
</tr>
</table>
<img src="static/logo.jpg" alt="" width="150" height="150">
<br>
<p class="solid" bgcolor="FFFFFF">Quote To</p>
<br>
<div>
<table class="table table-bordered">
<tbody>
<tr>
<th>OUR REF</th>
<td>{{query1.ourref}}</td>
<th>TO</th>
<td>{{query1.to}}</td>
</tr>
<tr>
<th>DATE</th>
<td>{{query1.date}}</td>
<th>ATTN</th>
<td>{{query1.attn}}</td>
</tr>
<tr>
<th>FROM</th>
<td>{{query1.fromq}}</td>
<th>EMAIL/FAX</th>
<td>{{query1.emailfax}}</td>
</tr>
<tr>
<th>PRC BASIS</th>
<td>{{query1.prcbasis}}</td>
<th>YR REF</th>
<td>{{query1.yrref}}</td>
</tr>
<tr>
<th>LEAD TIME</th>
<td>{{query1.leadtime}}</td>
<th>VALIDITY</th>
<td>{{query1.validity}}</td>
</tr>
<tr>
<th>PAYMENT</th>
<td>{{query1.payment}}</td>
<th>REMARKS</th>
<td>{{query1.remarks}}</td>
</tr>
</tbody>
</table>
</div>
<br>
<table id="itemtable" width="925" id="particular" border="1px solid black" >
<thead>
<tr bgcolor="#FF0000">
<th ><font color="#fff">NO</th>
<th><font color="#fff">PART NAME</th>
<th><font color="#fff">QTY</th>
<th><font color="#fff">U/PRICE</th>
<th><font color="#fff">AMOUNT in RS.</th>
</tr>
</thead>
<tbody>
{% for items in query %}
<tr height="88px" >
<td width="2"0 style="border-top:none; border-bottom:none;">{{items.id}}</td>
<td width="400" style="border-top:none; border-bottom:none;">{{items.itemname}}</td>
<td style="text-align:center; border-top:none; border-bottom:none;" width="100">{{items.qty}}</td>
<td style="text-align:center; border-top:none; border-bottom:none;" width="100">{{items.price}}</td>
<td style="text-align:center; border-top:none; border-bottom:none;" width="150">{{items.qty * items.price}}</td>
</tr>
{% endfor %}
{% for i in range(8 - count) %}
<tr height="95px">
<td width=20></td>
<td width=400></td>
<td style="text-align:center;" width="100"></td>
<td style="text-align:center;" width="100"></td>
<td style="text-align:center;" width="150"></td>
</tr>
{% endfor %}
</tbody>
<tfoot>
<tr bgcolor="#FF0000">
<td style="text-align:center;"></td>
<td style="text-align:right;"colspan="3"><font color="#fff">TOTAL PAK RUPEE.</td>
<td style="text-align:center;" ><font color="#fff">6250</td>
</tr>
</tfoot>
</table>
<p>17%GST EXTRA</p>
<p>PARTIAL ORDER SUBJECT TO OUR CONFIRMATION</p>
<p>THE PRICE MAY CHANGE, IF THE US DOLLAR CONVERSION RATE FLUCTUATES.</p>
<h4 style="float:right;"> <small>For </small>HAMZA ENTERPRISES </h4>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
the pdf is something like this
python-3.x flask base64 python-pdfkit
i am going to add image in pdf file using flask. when i add img tag in my html code, it won't appear. how can i add image in my pdf?
i found something like to convert in base64, but i don't know how to do it in python.
below is my flask route code.
@app.route('/pdf')
def pdf_template():
rendered = render_template('pdf_template.html')
css = ['main.css']
pdf = pdfkit.from_string(rendered,False,css=css)
response = make_response(pdf)
response.headers['Content-Type'] = 'application/pdf'
response.headers['Content-Disposition'] = 'inline; filename=output.pdf'
return response
here is my pdf_html file
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<h1>QUOTATION</h1>
<table class="table table-bordered" width='375'>
<tr>
<th>Address</th>
<td>pakistan</td>
</tr>
<tr>
<th>Tel</th>
<td>0213123456</td>
</tr>
<tr>
<th>Mobile</th>
<td>03211234567</td>
</tr>
<tr>
<th>Email</th>
<td>demo@demo.com</td>
</tr>
<tr>
<th>Website</th>
<td>www.example.com</td>
</tr>
</table>
<img src="static/logo.jpg" alt="" width="150" height="150">
<br>
<p class="solid" bgcolor="FFFFFF">Quote To</p>
<br>
<div>
<table class="table table-bordered">
<tbody>
<tr>
<th>OUR REF</th>
<td>{{query1.ourref}}</td>
<th>TO</th>
<td>{{query1.to}}</td>
</tr>
<tr>
<th>DATE</th>
<td>{{query1.date}}</td>
<th>ATTN</th>
<td>{{query1.attn}}</td>
</tr>
<tr>
<th>FROM</th>
<td>{{query1.fromq}}</td>
<th>EMAIL/FAX</th>
<td>{{query1.emailfax}}</td>
</tr>
<tr>
<th>PRC BASIS</th>
<td>{{query1.prcbasis}}</td>
<th>YR REF</th>
<td>{{query1.yrref}}</td>
</tr>
<tr>
<th>LEAD TIME</th>
<td>{{query1.leadtime}}</td>
<th>VALIDITY</th>
<td>{{query1.validity}}</td>
</tr>
<tr>
<th>PAYMENT</th>
<td>{{query1.payment}}</td>
<th>REMARKS</th>
<td>{{query1.remarks}}</td>
</tr>
</tbody>
</table>
</div>
<br>
<table id="itemtable" width="925" id="particular" border="1px solid black" >
<thead>
<tr bgcolor="#FF0000">
<th ><font color="#fff">NO</th>
<th><font color="#fff">PART NAME</th>
<th><font color="#fff">QTY</th>
<th><font color="#fff">U/PRICE</th>
<th><font color="#fff">AMOUNT in RS.</th>
</tr>
</thead>
<tbody>
{% for items in query %}
<tr height="88px" >
<td width="2"0 style="border-top:none; border-bottom:none;">{{items.id}}</td>
<td width="400" style="border-top:none; border-bottom:none;">{{items.itemname}}</td>
<td style="text-align:center; border-top:none; border-bottom:none;" width="100">{{items.qty}}</td>
<td style="text-align:center; border-top:none; border-bottom:none;" width="100">{{items.price}}</td>
<td style="text-align:center; border-top:none; border-bottom:none;" width="150">{{items.qty * items.price}}</td>
</tr>
{% endfor %}
{% for i in range(8 - count) %}
<tr height="95px">
<td width=20></td>
<td width=400></td>
<td style="text-align:center;" width="100"></td>
<td style="text-align:center;" width="100"></td>
<td style="text-align:center;" width="150"></td>
</tr>
{% endfor %}
</tbody>
<tfoot>
<tr bgcolor="#FF0000">
<td style="text-align:center;"></td>
<td style="text-align:right;"colspan="3"><font color="#fff">TOTAL PAK RUPEE.</td>
<td style="text-align:center;" ><font color="#fff">6250</td>
</tr>
</tfoot>
</table>
<p>17%GST EXTRA</p>
<p>PARTIAL ORDER SUBJECT TO OUR CONFIRMATION</p>
<p>THE PRICE MAY CHANGE, IF THE US DOLLAR CONVERSION RATE FLUCTUATES.</p>
<h4 style="float:right;"> <small>For </small>HAMZA ENTERPRISES </h4>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
the pdf is something like this
python-3.x flask base64 python-pdfkit
python-3.x flask base64 python-pdfkit
edited Nov 7 at 15:15
James Z
11.1k71735
11.1k71735
asked Nov 7 at 14:02
Hamza Awan
123
123
add a comment |
add a comment |
1 Answer
1
active
oldest
votes
up vote
0
down vote
Put below image tag in desired location in your HTML.
If you want to be consistent of your image size, I highly recommend putting below image tag into a table structure.
For converting image to base 64, try https://www.base64-image.de/
<img src="data:image/jpeg;base64,asa43asdf.............">
add a comment |
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
up vote
0
down vote
Put below image tag in desired location in your HTML.
If you want to be consistent of your image size, I highly recommend putting below image tag into a table structure.
For converting image to base 64, try https://www.base64-image.de/
<img src="data:image/jpeg;base64,asa43asdf.............">
add a comment |
up vote
0
down vote
Put below image tag in desired location in your HTML.
If you want to be consistent of your image size, I highly recommend putting below image tag into a table structure.
For converting image to base 64, try https://www.base64-image.de/
<img src="data:image/jpeg;base64,asa43asdf.............">
add a comment |
up vote
0
down vote
up vote
0
down vote
Put below image tag in desired location in your HTML.
If you want to be consistent of your image size, I highly recommend putting below image tag into a table structure.
For converting image to base 64, try https://www.base64-image.de/
<img src="data:image/jpeg;base64,asa43asdf.............">
Put below image tag in desired location in your HTML.
If you want to be consistent of your image size, I highly recommend putting below image tag into a table structure.
For converting image to base 64, try https://www.base64-image.de/
<img src="data:image/jpeg;base64,asa43asdf.............">
<img src="data:image/jpeg;base64,asa43asdf.............">
<img src="data:image/jpeg;base64,asa43asdf.............">
answered Nov 7 at 22:46
Jessi
288619
288619
add a comment |
add a comment |
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53191016%2fconvert-image-in-base64-in-flask-to-adding-in-pdf%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown