✊🏿 Black Lives Matter. Please consider donating to Black Girls Code today.
⚾️ It's finally Baseball season! Root for the home team... & Register for our Sports Analytics Webinar!

Callback using dcc.Location and href not triggered - no page update

Hi @chriddyp! I am quite stuck at this problem and it is driving me crazy. I’ll appreciate any help.

Sorry if this was answered before but I couldn’t find any other post.

I have this app which uses dcc.Location in order to get the URL with a callback. I have the input href in that callback in order to obtain the full URL and then process its parameters to query to the database data depending on them.

The problem is that the app sometimes does not update or refresh the URL and it loads a page with the data from a previous query. It seems random. It starts failing after the fifth time after restarting the service.

In the dcc.Location I have the refresh=True, however, it does not work.

I checked the log and there is no error.
And at the nginx access.log I see that when it works there are three GET to dash components and 2 POSTS to update_component. When it doesn’t, there are only the three GET with no POST.

I noticed that in the browser, when it works it also says “Updating…”, which disappears when it does not work (it only shows Loading…).

Sometimes the very first time after service re-start it fails to load the page “Error loading layout”.

Here is the nginx access log:
10.68.21.68 - - [20/Oct/2018:16:50:22 +0000] “GET /top_ccc_articles/?list=men&lang_origin=et&lang_target=ru HTTP/1.1” 200 717 “-” “Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36”

10.68.21.68 - - [20/Oct/2018:16:50:23 +0000] “GET /top_ccc_articles/_dash-dependencies HTTP/1.1” 200 124 “http://wcdo.wmflabs.org/top_ccc_articles/?list=men&lang_origin=et&lang_target=ru” “Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36”

10.68.21.68 - - [20/Oct/2018:16:50:23 +0000] “GET /top_ccc_articles/_dash-layout HTTP/1.1” 200 282 “http://wcdo.wmflabs.org/top_ccc_articles/?list=men&lang_origin=et&lang_target=ru” “Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36”

10.68.21.68 - - [20/Oct/2018:16:50:23 +0000] “POST /top_ccc_articles/_dash-update-component HTTP/1.1” 200 41 “http://wcdo.wmflabs.org/top_ccc_articles/?list=men&lang_origin=et&lang_target=ru” “Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36”

10.68.21.68 - - [20/Oct/2018:16:50:25 +0000] “POST /top_ccc_articles/_dash-update-component HTTP/1.1” 200 50882 “http://wcdo.wmflabs.org/top_ccc_articles/?list=men&lang_origin=et&lang_target=ru” “Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36”

10.68.21.68 - - [20/Oct/2018:16:50:30 +0000] “GET /top_ccc_articles/?list=men&lang_origin=et&lang_target=ca HTTP/1.1” 200 717 “-” “Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36”

10.68.21.68 - - [20/Oct/2018:16:50:31 +0000] “GET /top_ccc_articles/_dash-dependencies HTTP/1.1” 200 124 “http://wcdo.wmflabs.org/top_ccc_articles/?list=men&lang_origin=et&lang_target=ca” “Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36”

10.68.21.68 - - [20/Oct/2018:16:50:32 +0000] “GET /top_ccc_articles/_dash-layout HTTP/1.1” 200 50876 “http://wcdo.wmflabs.org/top_ccc_articles/?list=men&lang_origin=et&lang_target=ca” “Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36”

Here is the code:

import flask
from flask import send_from_directory
from dash import Dash
import dash
import dash_html_components as html
import dash_core_components as dcc
import dash_table_experiments as dt
from dash.dependencies import Input, Output, State

app = flask.Flask(name)

if name == ‘main’:
handler = RotatingFileHandler(‘wcdo_app.log’, maxBytes=10000, backupCount=1)
handler.setLevel(logging.INFO)
app.logger.addHandler(handler)
app.run(host=‘0.0.0.0’, threaded=True)

dash_app7 = Dash(name, server = app, sharing=True, url_base_pathname=webtype+’/top_ccc_articles/’, external_stylesheets=external_stylesheets)
dash_app7.layout = html.Div([
dcc.Location(id=‘url_value’, refresh=True),
html.Div(id=‘page-contenta’)
])

@dash_app7.callback(Output(‘page-contenta’, ‘children’),
inputs=[Input(‘url_value’, ‘href’)])
def app7_display_url(href):

if not href:
    return []
parse_result = urlparse(href)
params = parse_qsl(parse_result.query)
arguments = dict(params)

lang_origin = arguments['lang_origin']
lang_origin = lang_origin.lower()
lang_target = arguments['lang_target']
lang_target = lang_target.lower()
list_name = arguments['list']
list_name = list_name.lower()

dash_app7.layout = html.Div([
    html.H3(title, style={'textAlign':'center'}),
    dcc.Markdown(
        text.replace('  ', ''),
    containerProps={'textAlign':'center'}),
    html.Table(
    # Header
    [html.Tr([html.Th(col) for col in columns])] +
    # Body
    [html.Tr([
        html.Td(df_row[x]) for x in range(len(columns))
    ]) for df_row in df_list])

], className="container")

return dash_app7.layout

I had an issue this week where the browser cached the responses and therefore didn’t update the page, it could be something similar?

This solution worked for me: Weird app.layout behavior only on IE (example included)

Thanks for sharing @Damian.

I tried it and it did not work.

I am not sure the browser has anything to do with it.
I tried loading a new URL on a new browser and sometimes it does fail too (which might imply it has nothing to do with the browser cache but another type of cache in Dash/Plotly).

It serves the same previous layout without a callback…although checking the nginx log it seems that it does not even do the requests POST, so I do not understand what is going on.

Could anyone with more experience take a look, please?
Thanks.