web-dev-qa-db-fra.com

Passer des variables de flask à javascript

J'ai regardé des forums similaires mais je n'ai pas réussi à trouver de solutions. J'essaie de passer des variables de flask à mon Java. Ces valeurs seront ensuite utilisées pour PubNub à partir de mon fichier javascript).

Voici une partie de mon Python:

@app.route("/mysettings/")
def user_settings(): 
        return render_template('Settings.html',  project_name = session['project_name'] , publish_key = session['publish_key'] , subscribe_key = session['subscribe_key'] )

Voici une partie de mon code javascript (app.js):

var settings = {
        channel: {{project_name}},
        publish_key: {{publish_key}},
        subscribe_key: {{subscribe_key}}
    };

ce code fonctionne si je l'utilise dans mon fichier Settings.html mais pas dans le fichier app.js.

19
pang

Les réponses mobiusklein sont plutôt bonnes, mais il y a un "hack" à considérer. Définissez votre méthode Javascript pour recevoir des paramètres et envoyer des données en tant que paramètres à votre fonction.

main.py

@app.route('/')
def hello():
    data = {'username': 'Pang', 'site': 'stackoverflow.com'}
    return render_template('settings.html', data=data)

app.js

function myFunc(vars) {
    return vars
}

settings.html

<html>
    <head>
         <script type="text/javascript" {{ url_for('static', filename='app.js')}}></script>
         <script type="text/javascript">
            myVar = myFunc({{vars|tojson}})
         </script>
    </head>
</html>
22
Mauro Baraldi

Un moyen simple de passer des variables de flask vue du modèle au fichier javascript avec un exemple simple mentionné par @mauro.

main.py

@app.route('/')
def hello():
    data = {'username': 'Pang', 'site': 'stackoverflow.com'}
    return render_template('settings.html', data=data)

settings.html

<html>
    <head>
         <script type="text/javascript">
            var username = {{ data.username }}
            var site = {{ data.site }}
        </script>
        <script type="text/javascript" src="app.js"></script>
    </head>
</html>

app.js

function myFunc() {
    return username + site
}
17
shrishinde

La raison en est que jinja2 doit être utilisé pour effectuer la substitution, ce qui, d'après votre code, ne semble pas se produire.

Il y a de fortes chances que vous serviez app.js en tant que fichier statique, ce qui signifie qu'il n'est jamais regardé par la machinerie du moteur de modèles, juste servi tel quel.

Vous pouvez accomplir ce que vous décrivez en servant app.js à partir d'une URL liée à une action qui transmet le contenu de app.js par le biais de Flask render_template fonction, exécution jinja2 substitutions et toutes les autres informations de personnalisation, mais cela signifie jinja2 doit analyser l'ensemble du fichier, ce qui peut être coûteux.

Vous pouvez essayer de transmettre ces variables à l'aide d'une demande AJAX ayant reçu une réponse qui renvoie ces mêmes données dans JSON. Il s'agit d'une pratique beaucoup plus courante et qui a la valeur ajoutée de rendre ces données visibles par d'autres ressources.

3
mobiusklein