Mobile app version of vmapp.org
Login or Join
Shelley277

: How do I deploy a favicon on Heroku? I have the following Hello world code for my Heroku app. Also in my project's root folder, I have a favicon.ico. import os from flask import Flask app

@Shelley277

Posted in: #Favicon #Heroku

I have the following Hello world code for my Heroku app. Also in my project's root folder, I have a favicon.ico.

import os
from flask import Flask
app = Flask(__name__)

html = '''
<!doctype html>
<html>
<head>
<link rel="shortcut icon" href="/favicon.ico">
<title>Hello world!</title>
</head>
<body>
<p>Hello world!</p>
</body>
</html>
'''
@app .route('/')
def index():
return html

if __name__ == '__main__':
port = int(os.environ.get('PORT', 5000))
app.run(host='0.0.0.0', port=port)


When I browse to my app, I don't see a favicon. Also, when I check heroku logs, I get the following 404 line:

2012-02-14T05:23:29+00:00 app[web.1]: <ip.ad.dr.es> - - [14/Feb/2012 05:23:29] "GET /favicon.ico HTTP/1.1" 404 -

10.03% popularity Vote Up Vote Down


Login to follow query

More posts by @Shelley277

3 Comments

Sorted by latest first Latest Oldest Best

 

@Murray432

I put my favicon.ico image in my public/ folder in my rails app. Then I deployed to heroku and had to clear my browser cache before the new one showed up.

10% popularity Vote Up Vote Down


 

@Shelley277

I just found it right here: flask.pocoo.org/docs/patterns/favicon/
I varied from it a bit and here's what I did:


In my tree, I store the icon as static/images/favicon.ico
In the HTML, I have the following line in the <head>:

<link rel="shortcut icon" href="/favicon.ico">

In my Flask app, I have the following URL handler for /favicon.ico
@app .route('/favicon.ico')
def favicon():
return send_from_directory(os.path.join(app.root_path, 'static', 'images'),
'favicon.ico', mimetype='image/png')


Why image/png? Because if I use image/vnd.microsoft.icon, then I browse to myapp.heroku.com/favicon.ico, I get a download dialog box. image/png just displays the favicon on the page (at least on Chrome).

10% popularity Vote Up Vote Down


 

@Cofer257

Here is what I use:

<link rel="shortcut icon" type="image/x-icon" href="/favicon.ico">


I believe the "shortcut" should be in there for Internet Explorer (although IE will usually check for a favicon regardless).

However, it sounds like the icon is in the wrong location. You should be able to access it via yoursite.com/favicon.ico. You could also check by viewing the page source in Google Chrome and /favicon.ico will be an underlined link - click that to open the location you have specified.

UPDATE: Do you have a .htaccess file? From what you have said, it sounds like you need to make an exception for existing files to bypass the app. If you are using Apache you'd use something like this:

RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule your_rule_here [L]


There should be an equivalent for the platform you are using.

10% popularity Vote Up Vote Down


Back to top | Use Dark Theme