Panel serve bokeh server show empty page

Panel
1

Hi,
I try to deploy a panel dashboard on my django webserver. I do not want to build a django panel app. I have a script called visz_pn_ssm_1.py where i create a simple dashboard


import pandas as pd
import geopandas as gpd
import panel as pn
import hvplot.pandas
import pickle
from bokeh.layouts import column

pn.extension()
pn.config.js_files  = {'deck': 'https://unpkg.com/deck.gl@~5.2.0/deckgl.min.js'}
pn.config.css_files = ['https://api.tiles.mapbox.com/mapbox-gl-js/v0.44.1/mapbox-gl.css']

def build_dashboard():
    with open ('/opt/bitnami/projects/data/filepath_ssm_user.pickl', 'rb') as temp:
        res = pickle.load(temp)

    # ried soil samples 30m 17-19
    gdf = pd.read_csv(f'/opt/bitnami/projects/data/tables/{res[0]}'
                ,)[['date', 'ssm']].dropna().reset_index(drop=True)
    gdf['date'] = gdf['date'].astype('datetime64[ns]')

    #Options for Widgets
    years = gdf.date.dt.year.unique()

    # Widgets
    year_slider = pn.widgets.IntSlider(name = 'Year', start=int(years.min()), end=int(years.max()), value=int(years[0]))

    @pn.depends(year_slider)
    def plot_data(year_slider):
        data_select = gdf[gdf['date'].dt.year == year_slider]

       

        # Scatter Plot
        scatter = data_select.hvplot.scatter(
            x = 'date',
            y = 'ssm',
            title = f'Oberflächennahe Bodenfeuchte'
        )
        return scatter

    # Non Parameter Attributes
    title = 'Oberflächennahe Bodenfeuchte berechnet mithilfe von Convolutional Neuronal Networks aus Sentinel 1 & 2 & ERA 5 Satelliten Daten'

    header_box = pn.WidgetBox(title,
                            year_slider,
                            align="center"
                            )

    # Plot Box
    return pn.Row(header_box, plot_data)

if __name__.startswith("bokeh"):

    # start with panel serve script.py

    dashboard = build_dashboard()

    dashboard.servable()

i call the script via subprocess.Popen in my django views
Popen(["panel", "serve","--show","/opt/bitnami/projects/blog/EnviAI/scripts/visz_pn_ssm_1.py", "--log-level", "debug"])

The console output says:

2022-04-03 11:40:26,577 Bokeh app running at: localhost:5006/visz_pn_ssm_1
2022-04-03 11:40:26,577 Starting Bokeh server with process id: 29326

so i guess the server is deployed.

Then i can click a button on my webpage to create a connection to the bokeh server. The function in my views.py looks like:

def redirect_bokeh_server(request):
        session = pull_session(url="http://localhost:5006/visz_pn_ssm_1/")
        script = server_session(model=None,session_id=session.id,url="http://localhost:5006/visz_pn_ssm_1/")
        return render(request, 'dashboard_ssm.html', {'script' : script})

The console output looks like it works:

2022-04-03 11:40:33,658 Subprotocol header received
2022-04-03 11:40:33,659 WebSocket connection openedtest
2022-04-03 11:40:34,728 Receiver created for Protocol()
2022-04-03 11:40:34,728 ProtocolHandler created for Protocol()
2022-04-03 11:40:34,728 ServerConnection created
2022-04-03 11:40:34,773 Sending pull-doc-reply from session
2022-04-03 11:40:41,585 [pid 29326] 1 clients connected
2022-04-03 11:40:41,585 [pid 29326] /visz_pn_ssm_1 has 1 sessions with 0 unused

My dashboard.html file looks like:

{% load static %}

<!DOCTYPE html>
<html>
  <head>
    <title>Panel </title>
    <script type="text/javascript" src="https://cdn.bokeh.org/bokeh/release/bokeh-2.4.2.min.js"></script>
  </head>
  <body>
    {% block content %}
    {{ script|safe }}
    {% endblock %}
  </body>
</html>

But the resulting page is empty

Unbenannt
Unbenannt1879×975 79.6 KB

there are similiar problems out there but after 2 days of try and error i hope somebody can help me i am new to networking stuff… The following things i tried.

  1. Replace redirect_bokeh_server function with this one and dont start the server with subprocess.Popen()
def redirect_bokeh_server(request: HttpRequest) -> HttpResponse:
    script = server_document('/opt/bitnami/projects/blog/EnviAI/scripts/visz_pn_ssm_1')
    return render(request, 'dashboard_ssm.html', {'script': script})

  1. Add additinal stuff to the scripts. Do i need this at all??
    pn.extension()
    pn.config.js_files = {‘deck’: ‘https://unpkg.com/deck.gl@~5.2.0/deckgl.min.js’}
    pn.config.css_files = [‘https://api.tiles.mapbox.com/mapbox-gl-js/v0.44.1/mapbox-gl.css’]

  2. Add and remove a lot of cdn links to the html file. Do I need this at all?
    <script type="text/javascript" src="https://cdn.bokeh.org/bokeh/release/bokeh-2.4.2.min.js"></script>

  3. sometimes i read {{script | safe}} should stay in body sometimes i read in head what is right? I try both.

When i run in it my local enviroment i get the dashboard.
Greetings!