Python >> Tutoriel Python >  >> Python

[Dash + Flask] Comment déployer une application Python Dash sur Pythonanywhere.com

📖 Apprentissage complémentaire :Pour un guide complet sur la façon de créer votre belle application de tableau de bord en Python pur, consultez notre livre à succès Python Dash avec l'éditeur NoStarch basé à San Francisco.

Voici l'approche étape par étape pour déployer votre application Dash sur Pythonanywhere.com en utilisant Flask et pip :

  • Créez un compte sur Pythonanywhere.com.
  • Créer une application Flask.
  • Créer une application Dash.
  • Copiez l'application Dash dans l'application Flask.
  • Connectez le serveur Flask à l'application Dash.
  • Modifier le fichier de configuration WSGI.
  • Installez Dash avec pip dans votre shell bash (par exemple, pip3.7 install dash – user )
  • Actualisez votre serveur Flask.

Comment intégrer Dash à votre application existante

Avez-vous une application non-dash existante et souhaitez-vous y intégrer un tableau de bord ?

Avis de non-responsabilité :Si vous me demandez, ce n'est pas la meilleure idée. Ne pouvez-vous pas garder votre site Web propre et simple? Une page pour une intention. Devez-vous vraiment intégrer une application Dash à part entière dans cette application Web particulière ? Avant de répondre :oui !, veuillez considérer ce qui suit :vous pouvez toujours intégrer des graphiques interactifs avec JavaScript.

Par exemple, une excellente alternative serait CanvaJS. Je ne suis pas affilié à ces gars-là, mais ils ont créé un excellent cadre qui peut être utilisé sur n'importe quel site Web. Heck, vous pouvez même utiliser des graphiques Plotly sur votre site Web pour visualiser les données. (Ce sont les créateurs de Dash.)

La raison pour laquelle je ne préconise pas d'utiliser le tiret dans votre application existante (HTML/CSS/JS) est qu'il est fastidieux, sujet aux erreurs et qu'il ralentit votre site Web.

Je vais vous donner trois façons, classées par difficulté :

1 - Placer les liens intelligemment

Croyez-le ou non, j'ai trouvé cette stratégie géniale tout seul. Au lieu d'intégrer votre application à Dash, il vous suffit de créer un lien vers votre application Dash distincte (indépendante) afin qu'elle apparaisse comme si les deux sites Web (votre original et l'application Dash) fonctionnent ensemble et sont étroitement intégrés. Cependant, ils fonctionnent de manière indépendante et vous pouvez éviter toutes les difficultés et continuer à vivre une vie simple.

2 – Utiliser des iFrames

Sur le site officiel de Dash pour ce problème, ils recommandent d'utiliser un <iframe>.

💡 Un iFrame est un élément HTML qui vous permet d'intégrer n'importe quel site Web Y sur le site Web X. C'est comme une fenêtre sur l'autre site Web.

Sur la page X, vous pouvez définir la taille de la fenêtre et l'environnement autour de la fenêtre. Mais vous pouvez contrôler un peu plus.

Bien que cela puisse fonctionner théoriquement, cela ralentit souvent les sites Web et cause des problèmes de sécurité. Certains navigateurs Web bloquent complètement l'utilisation des iFrames. Ainsi, il peut arriver que les utilisateurs ne voient même pas votre superbe application Dash !

Voulez-vous toujours l'essayer avec des iFrames ? Ok, alors allez-y :

  • Inclure un <iframe> élément dans votre site HTML.
  • Pointer le src vers l'adresse de votre application Dash.
  • Placez l'iFrame de votre application Dash sur votre site Web en définissant les dimensions souhaitées :
<iframe src="http://localhost:8050" width=1200 height=800></iframe>

Voici à quoi ressemble une telle application iFrame Dash intégrée sur le site Web de Finxter :

Ça n'a pas l'air joli, n'est-ce pas ?

Utiliser une application Flask existante

Oui, tous les programmeurs salivent. C'est juste magnifique d'intégrer nativement deux applications, n'est-ce pas ? Eh bien, si vous le pensez. Je pense que c'est un gros gâchis et vous vous maudirez de l'avoir fait.

Cependant, si vous devez le faire, voici comment vous pouvez le faire (basé sur cette ressource et la documentation) :

Accédez à l'application Flask via app.server et affectez-le à une variable (par exemple, server ).

import dash
app = dash.Dash(__name__)
server = app.server

Comme alternative, transmettez votre instance d'application Flask dans Dash lors de l'instanciation de l'application dans le dash.Dash(...) routine d'initialisation.

import flask
server = flask.Flask(__name__)
app = dash.Dash(__name__, server=server)

Qu'avez-vous accompli ? Le server La variable contient maintenant l'instance Flask. Cela vous permet d'ajouter n'importe quel itinéraire et fonctionnalité personnalisée comme ceci :

@server.route('/hello')
def hello():
    return 'Hello, World!'

Vous pouvez voir un tel exemple dans le code donné ici :

from flask import Flask
from dash import Dash
import dash_core_components as dcc
import dash_html_components as html


server = Flask(__name__)
app = dash.Dash(
    __name__,
    server=server,
    url_base_pathname='/dash'
)

app.layout = html.Div(id='dash-container')

@server.route("/dash")
def my_dash_app():
    return app.index()

Mais les auteurs du code partagent le même avertissement :ça craint ! Vous perdez beaucoup de fonctionnalités Flask intégrées lorsque vous travaillez à l'intérieur de Dash comme celui-ci.

Peut-être revenir à la Méthode 1 ? Une meilleure façon consiste à utiliser Dash depuis Flask, au lieu d'utiliser Flask depuis Dash. Vous pouvez voir comment cela fonctionne ici (faites défiler jusqu'à la rubrique "Combiner une ou plusieurs applications Dash avec des applications WSGI existantes").

Livre de tableau de bord Python


Si vous souhaitez en savoir plus sur la création de superbes applications de tableau de bord en Python, consultez notre nouveau livre Python Dash.

Vous avez déjà vu des tableaux de bord ; pensez à des visualisations des résultats des élections que vous pouvez mettre à jour en temps réel ou à des cartes de la population que vous pouvez filtrer par groupe démographique.

Avec la bibliothèque Python Dash, vous allez créer des tableaux de bord analytiques qui présentent les données de manière efficace, utilisable et élégante en quelques lignes de code seulement.

Obtenez le livre sur NoStarch ou Amazon !