Serving a Panel app with over HTTPS


Problem: I am trying to serve an app (via Docker), which has a map, over https. But the component doesn’t display as soon as SSL cert is supplied or a proxy is set up (Nginx). Unsure whether the problem lies in Pydeck or Panel.
Short question: Does anyone know how to serve a Panel app with a component over https?

Note: Please let me know if you want to see working code and which combination (e.g. nginx + panel or panel using Bokeh’s SSL support), right now I just focused on the parts which might cause the error. Because I tried quite a lot of combinations I thought I would clutter the thread with too much code and thereby make it more confusing.

What I tried:
I started out by first running the app without https and on port 5006, which works fine.

Now, I saw that Bokeh supports supplying SSL certificates with the serve command and therefore I used it on
the Panel serve command. It works except for the map (all other Panel elements show just fine):

panel serve --port=5006 --ssl-certfile cert.pem --ssl-keyfile cert.key --show"]


panel serve --port=443 --allow-websocket-origin=localhost --ssl-certfile cert.pem --ssl-keyfile cert.key --show"

With mapping those ports to the same ones or mapping the port 443 on the host to 5006 of the container, in all those cases I see all Panel elements except the map.

Because web deployment is new to me, I thought an alternate method could help, therefore I tried to use Nginx.
I started simple by first creating a proxy without the SSL. Just the http proxy by itself resulted in the same issue of an empty element where the map should be.

I did some tests by serving the following via Nginx (used some examples instead of my own app, just in case):

  • Serving a static pydeck html file (using Pydeck’s to html functionality): works.
  • Serving this example (examples/gallery/external/ as a script not a notebook: works, this one doesn’t use pydeck directly
  • Serving this example (examples/gallery/param/deck_gl_global_power_plants) as a script not a notebook: component doesn’t display

For me this isn’t conclusive whether the problem arises in Pydeck or Panel, because the first example is just static and just generates a html file and isn’t using the Pydecks bindings when serving.

For the second example it is the same becaue it also doesn’t use Pydeck directly.

Some snippets which I used for points 2 and 3:

Nginx: proxy.conf:

server {
listen 80;
server_name localhost;

location / {
    proxy_pass http://docker_service_name:5006;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection "upgrade";
    proxy_http_version 1.1;
    proxy_set_header X-Forwarded-Proto $scheme;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header Host $host:$server_port;
    proxy_buffering off;


Here I just ported from 80 of the host to 80 of the Nginx container (also tried other combinations but sam results)

Served using:

panel serve --port=5006 --allow-websocket-origin=localhost --use-xheaders --show front_end/


Browser: Brave (same result in Firefox)
python: 3.8.5
panel version: 0.9.7
pydeck: 0.4.0
SSL certificate type: self signed (for testing)

The error I get:
After applying the formatting in Brave on the minimized js file:

in createDeck

panel.min.js:50 (formatted: 602) Error: Could not parse position string null
at h (dist.min.js:formatted:12318)
at e.value (dist.min.js:formatted:12463)
at e.t (dist.min.js:formatted:12370)
at new MapView (dist.min.js:formatted:22689)
at dist.min.js:formatted:873
at S (dist.min.js:formatted:874)
at dist.min.js:formatted:973
at J (dist.min.js:formatted:974)
at dist.min.js:formatted:950
at ()

The issue has been fixed.

The proxy actually wasn’t the issue but rather some versions of pydeck are not supported.

If you run into a similar issue where the object is not loading, try fixing the pydeck version to a lower version.

1 Like

Could you file an issue to support more recent versions?

Yes, I’ll submit one later today.

1 Like