fohrloop / dash-uploader

The alternative upload component for python Dash applications.
MIT License
141 stars 29 forks source link

Post - 404 (multiple dash apps) #27

Closed kaleming closed 3 years ago

kaleming commented 3 years ago

Hi, I am using this architecture to deploy multiple dash apps on flask: Repository

I am quite confused the best way to integrate dash-uploader into init.py

May I declare du.configure_upload on callback of dashapp I want to use it (in order to avoid conflict ) ?

def register_callbacks(dashapp):

    UPLOAD_FOLDER = "/tmp/Uploads"
    du.configure_upload(dashapp, UPLOAD_FOLDER)

    @dashapp.callback(Output('callback-output', 'children'),
                [Input('upload-files-div', 'fileNames')])
    def display_files(fileNames):

        if fileNames is not None:
            out = []
            for filename in fileNames:
                file = Path(UPLOAD_FOLDER) / filename
                out.append(file)
            return html.Ul([html.Li(str(x)) for x in out])
        return html.Ul(html.Li("No Files Uploaded Yet!"))

Or should I insert this into this function ? It seems it occurs some conflicts declaring this more than 1 time.

def register_dashapp_1(app, title, base_pathname, layout, register_callbacks):
    # Meta tags for viewport responsiveness
    meta_viewport = {"name": "viewport", "content": "width=device-width, initial-scale=1, shrink-to-fit=no"}
    external_stylesheets = [dbc.themes.LUX]

    my_dashapp = dash.Dash(__name__,
                           server=app,
                           url_base_pathname=f'/{base_pathname}/',
                           assets_folder=get_root_path(__name__) + f'/{base_pathname}/assets/',
                           meta_tags=[meta_viewport])

    with app.app_context():
        my_dashapp.title = title 
        my_dashapp.layout = layout
        register_callbacks(my_dashapp)

    _protect_dashviews(my_dashapp)

My output is:

flask_1  | 172.21.0.1 - - [09/Mar/2021 19:20:32] "GET /upload/_dash-layout HTTP/1.1" 200 -
flask_1  | 172.21.0.1 - - [09/Mar/2021 19:20:32] "GET /upload/_dash-dependencies HTTP/1.1" 200 -
flask_1  | 172.21.0.1 - - [09/Mar/2021 19:20:32] "POST /upload/_dash-update-component HTTP/1.1" 200 -
flask_1  | 172.21.0.1 - - [09/Mar/2021 19:20:35] "POST /API/resumable?resumableChunkNumber=1&resumableChunkSize=1048576&resumableCurrentChunkSize=17396&resumableTotalSize=17396&resumableType=text%2Fcsv&resumableIdentifier=17396-datasetcsv&resumableFilename=dataset.csv&resumableRelativePath=dataset.csv&resumableTotalChunks=1&upload_id=80e27106-810c-11eb-a900-0242ac150003 HTTP/1.1" 404 -
flask_1  | 172.21.0.1 - - [09/Mar/2021 19:20:35] "POST /upload/_dash-update-component HTTP/1.1" 200 -
kaleming commented 3 years ago

It seems if I define on layout function, it works:

def layout(dashapp):

    UPLOAD_FOLDER = "/tmp/"
    du.configure_upload(dashapp, UPLOAD_FOLDER)

    return html.Div(
        [
            html.H1('Demo'),
            html.Div(
                du.Upload(
                    id='dash-uploader',
                    text='Drag and Drop Here to upload!',
                    text_completed='Uploaded: ',
                    cancel_button=True,
                    pause_button=False,
                    filetypes=['csv'],
                    default_style=None,
                    upload_id=None,
                    max_files=1,
                ),

                style={
                    'textAlign': 'center',
                    'width': '600px',
                    'padding': '10px',
                    'display': 'inline-block'
                },
            ),
            html.Div(id='callback-output')
        ],
        style={
            'textAlign': 'center',
        },

    )

I will make some more tests.