Dash Plotly app doesn't run

Dash Python
1

image
image1040×696 61.7 KB

Dear all,

I have a strange issue. I am migrating to gunicorn. I managed to migrate one project. It runs well. But I failed to migrate the second project. I put the Hello World Dash app that just has one HTML tag. The same error. Then I took the project that I have already successfully migrated. Still the same error message. This suggests that this issue is not an issue with the code. It may be be the issue with the version of Dash, Plotly or other modules. I created a virtual folder where I have installed the latest versions of modules required to run the project. The issue persists.

Any idea what it may be?

Another indirect evidence that this is an issue with the module versions is that the error is with the ‘require’ keyword. The ‘require’ keyword is run on the server side only. Thanks for pointing at the solution. I spent already a week trying to figure out a solution. I also tried various things like sys.path.addsitedir, both True/False for app.scripts.config.serve_locally

2

That does sound odd. This issue looks like its associated with running/loading the JavaScript modules, which makes the symptom you’re seeing more of a client-side issue, rather than a server side one. Though the root cause could well be with a server-side configuration problem.

Have you looked in the network tab of the dev tools to see if there’s any issues with the requests to retrieve the JavaScript assets?

if not, as a sanity check, I’d suggest trying the app in a fresh browser profile/private browsing mode, to check that it’s not some kind of weird caching issue.

1 Like
3

Thanks nedned,

Indeed, the issue looks very odd to me. The same code doesn’t run well in a different location.

Running in the fresh browser still gives the same error message. Network tab doesn’t show missing files. Again, the keyword ‘require’ is not supported by browsers. It is the Node.js thing.

I don’t know what to do. I checked a million times the nginx settings. They are good too.

image
image944×771 39.1 KB

4

Here is the weblink that explains that require is used in Node.js and therefore runs on the server side only

5

Here is what works in Dash+gunicorn+nginx+RedHat

image
image544×839 16 KB

6

Hello @jigu,

You are trying to load the external stylesheets locally? Bootstrap uses a cdn of the css file. Maybe this won’t load?

Try not passing the external stylesheets.

1 Like
7

No, I can use the external css. The issue was with the __ name __ present in the Dash class constructor. It worked now after removing __ name __ from the Dash class constructor. No idea why it created the issue.

But after removing the __ name __, the new issue appeared. The stylesheets in the assets folder aren’t served anymore. So I need to fix that __ name __ issue.

There is a thread discussing why having __ name __ is important. See it at How do I use Dash to add local css?

1 Like
8

This seems to be a bug in Dash Plotly. Here is another similar thread at __name__ module not working correctly in multi page app - #7 by AnnMarieW

1 Like
9

Hello @jigu,

What fixed that person’s issue was to do a fresh install of everything.

It is possible that you are missing a key element. Or library. Make sure your requirements is up to date. If you are using something like pyodbc in Linux, you’ll need to add a couple of things to make it work as well.

Also, the main thing just keeps it from running twice since gunicorn actually runs your server from the server. At least I think so.

10

Thanks jinnzyor,

Yes, you are right. I may be missing something installed. Although I must say I reinstalled everything a few times and properly tested. But I found a solution. Imperfect but it works.

Because the issue is with that __ name __ parameter, I skip it in the class constructor. As a consequence the local stylesheet and javascript files are not recognized by the app. So I add them to the constructor like below,

external_stylesheets=[dbc.themes.BOOTSTRAP]
external_scripts = [some_custom_javascript]

external_stylesheets.append(‘http://my_server/myapp/assets/my_styles.css’)
external_scripts.append(‘http://my_server/assets/myapp/my_custom_script.js’)

app = dash.Dash(external_stylesheets=external_stylesheets, external_scripts=external_scripts, requests_pathname_prefix= ‘/myapp/’)

This has solved the issue. Imperfect solution!

1 Like