'Flask app hosted on Heroku shows Bokeh plot on my computer but not on any other computer

I'm new to Flask and hosting apps on Heroku. I have written a fairly simple Flask App, and when I host it on Heroku and go to the app URL it displays the Bokeh plot correctly on my computer. However, when I access the app URL from any other computer the app loads fine (no error), but does not show the plot. Even the border for the Bokeh plot is missing. You can choose different cities from the drop-down menu, and the URL changes accordingly, but no plot is ever shown.

I have tried to figure out if the API call could be an issue, or the HTML file, but as far as I can tell neither is specific to my system. I have also tried modifying the Procfile using suggestions I found online, but none changed this behavior.

edit: I have figured out what the problem is. I'll detail the issue (and solution) below so if anyone else runs into the same problem they can see if the same solution works for them.

For me at least, the problem turned out to be in my html file. I've included it below.

<html>
<head>
<link
    href="http://cdn.bokeh.org/bokeh/release/bokeh-0.12.13.min.css" 
    rel="stylesheet" type="text/css">
<link
    href="http://cdn.bokeh.org/bokeh/release/bokeh-widgets-0.12.13.min.css"
    rel="stylesheet" type="text/css">

<script src="http://cdn.bokeh.org/bokeh/release/bokeh-0.12.13.min.js"></script>
<script src="http://cdn.bokeh.org/bokeh/release/bokeh-widgets-0.12.13.min.js"></script>

</head>
<body>
<H1>Cuisine Histogram</H1>

<form action="/">
<select name="zip_code">
    {% for feature in list_of_zips %}
        {% if feature == zip_code %}
            <option selected value="{{ feature }}">{{ feature }} . 
 </option> 
        {% else %} 
            <option value="{{ feature }}">{{ feature }}</option> 
        {% endif %}
    {% endfor %}
</select>
<input type="submit">
</form>

{{ script|safe }}
{{ div|safe }}

</body>
</html>

It turns out that if the reference and script calls are changed from http to https the plot displays correctly from any computer. Apparently the calls were silently being refused in the background to the pydata page. Changing to https allowed them to go through.

Solution 1:^[1]

It turns out that altering the call to the bokeh scripts from http to https resolved this issue. With the links changed to https the plot displayed correctly on all browsers on my system and on many other computers as well. Apparently the calls were probably being silently refused in the background, hence why there were no errors but just a large empty space where the plot should be.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1	Chiron

'Flask app hosted on Heroku shows Bokeh plot on my computer but not on any other computer

Solution 1:[1]

Sources

Related Questions

Solution 1:^[1]