Flask application static folder unable to be linked within a Jupyterhub Service

JupyterHub
1

The flask example in from github allowed me to run a flask application. This works great for a simple application, but I cannot connect the static folder. The templates folder, however does connect and I am able to use the render_template function.

For instance, my application runs at myurl.com/services/myapp but it cannot retrieve files in the static directory. Help in loading these static files would be greatly appreciated.

2

Hi! Welcome to the forum.

Unfortunately your post is a bit short, so it’s difficult for people to work out what issue might be. Could you post more information, ideally a full example so someone can reproduce your problem from scratch on their own system?

2 Likes
3

Sure. I’m trying to create a completely separate public web site from JuptyerHub. As in, I’d like anyone to be able to access myurl.com/separate_site. If there is a simpler way that using a “Service”, I’d be interested in that.

I successfully followed the Flask example from the JupyterHub github directory linked in the original post. I placed the web application folder in the /opt/JupyterHub/etc/JupyterHub directory which also contains the jupyterhub_congig.py file. Here is the file system breakdown.

  • certificates
    • __init__.py
    • static
      • cert.png
    • templates
      • cert.html

Issue

The files from the static folder are unable to be linked in the app. The cert.png file does not show up in the app. When I run a normal flask app (not on top of JupyterHub, the same configuration works).

Portion of jupyterhub_config.py file

services_list = [
     {
        'name': 'certificates',
        'url': 'http://127.0.0.1:10101',
        'command': ['gunicorn', '-w=4', '-b=127.0.0.1:10101', '--chdir=/opt/jupyterhub/etc/jupyterhub', 
                    '--log-file=/opt/jupyterhub/etc/jupyterhub/certificate_app/error.log',  'certificate_app:app']
    },]

c.JupyterHub.services = services_list

cert.html

For flask apps, you typically do one of the following. Either direct link or use url_for

<img src="/static/cert.png">
<img src="{{ url_for('static', filename = 'cert.png') }}">

__init__.py 

import os
from flask import Flask, render_template

prefix = os.environ.get('JUPYTERHUB_SERVICE_PREFIX', '/')

app = Flask(__name__)

@app.route(prefix)
def certificates():   
    return render_template('cert.html')
1 Like