web-dev-qa-db-fra.com

Flask et React routage

Je construis l'application Flask avec React, j'ai eu un problème d'acheminement.

Le backend est responsable d'être une API, par conséquent, certaines routes ressemblent à ceci:

@app.route('/api/v1/do-something/', methods=["GET"])
def do_something():
    return something()

et la route principale qui mène à la réaction:

@app.route('/')
def index():
    return render_template('index.html')

J'utilise react-router dans l'application React, tout fonctionne correctement, react-router me conduit à /something et j'obtiens la vue rendue, mais lorsque j'actualise la page sur /something, l'application Flask prend en charge cet appel. et je reçois une erreur Not Found.

Quelle est la meilleure solution? Je pensais à la redirection de tous les appels qui n'appelaient pas /api/v1/... vers /, ce n'est pas idéal car je vais récupérer la page d'accueil de mon application et non pas afficher la vue Réagir.

25
knowbody

Nous avons utilisé catch-all URL pour cela.

from flask import Flask
app = Flask(__name__)

@app.route('/', defaults={'path': ''})
@app.route('/<path:path>')
def catch_all(path):
    return 'You want path: %s' % path

if __== '__main__':
    app.run()

Vous pouvez également faire un effort supplémentaire et réutiliser le système Flask routing pour faire correspondre path aux mêmes itinéraires que le client afin d'intégrer les données dont le client aura besoin comme JSON dans la réponse HTML.

29
Dan Abramov

Peut-être comme extension aux réponses précédentes. Cela a résolu le problème pour moi:

from flask import send_from_directory

@app.route('/', defaults={'path': ''})
@app.route('/<path:path>')
def serve(path):
     path_dir = os.path.abspath("../build") #path react build
     if path != "" and os.path.exists(os.path.join(path_dir, path)):
         return send_from_directory(os.path.join(path_dir), path)
     else:
         return send_from_directory(os.path.join(path_dir),'index.html')
0
Henrik