Patrik
Patrik

Reputation: 55

Plotly dash in docker do not load assets

I have a multi-page dash application that works as expected when running it locally with:

waitress-serve --listen=0.0.0.0:80 web_app.wsgi:application

so all the assets within the assets folder loads correctly, the images ar loaded with src=app.get_asset_url('xyz.png') and have set app.css.config.serve_locally to true, as shown here everything loads working

But when loading the same app within a docker container the assets don't load not working and so the local css don't load either.

Have checked the files and folders within docker and everything is were it is expected to be.

I guess I'm missing something somewhere but don't find what, any suggestions on how to get it to work?

Dockerfile

FROM python:3

RUN apt-get update && apt-get install -qq -y \
build-essential libpq-dev --no-install-recommends

ENV INSTALL_PATH /gtg_analytics-master
ENV PYTHONPATH "${PYTHONPATH}:$INSTALL_PATH/web_app"
RUN mkdir -p $INSTALL_PATH

WORKDIR $INSTALL_PATH

COPY requirements.txt requirements.txt
RUN pip install -r requirements.txt

COPY web_app $INSTALL_PATH/web_app

docker-compose:

version: "3"

services:
web_app:
image: patber/gtg:dev
build: .
command: >
  waitress-serve --listen=0.0.0.0:80
  web_app.wsgi:application
environment:
  PYTHONUNBUFFERED: 'true'
volumes:
  - '.:/web_app'
ports:
  - '80:80'

Upvotes: 3

Views: 3151

Answers (3)

Dan Runfola
Dan Runfola

Reputation: 1

This isn't great, but if you need to serve things other than css you can also use the external sources options:

app = dash.Dash(
    __name__,
    assets_external_path='http://your-external-assets-folder-url/'
)

I ran into this with an image, and that is the best (current = Jan 30 '20) solution I am aware of.

Upvotes: 0

horseshoe
horseshoe

Reputation: 1477

I ran into the same problem and the solution provided here is correct but you need to also add:

app.css.config.serve_locally = False

furthermore instead of append you can add the stylesheet by:

external_stylesheets=["./assets/stylesheet.css"]
app = dash.Dash(__name__, external_stylesheets=external_stylesheets)

Upvotes: 0

elevendollar
elevendollar

Reputation: 1204

Found a solution for the CSS files here.

app.css.append_css({"external_url": "./assets/xyz.css"})

Upvotes: 1

Related Questions