webentwicklung-frage-antwort-db.com.de

Flaschen- und Reakt-Routing

Ich baue die Flask-App mit React. Ich hatte ein Problem mit dem Routing.

Das Backend ist dafür verantwortlich, eine API zu sein, daher sehen einige Routen wie folgt aus:

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

und die Hauptroute, die zum React führt:

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

Ich benutze React-Router in der React-App, alles funktioniert gut, React-Router führt mich zu /something und ich bekomme die gerenderte Ansicht, aber wenn ich die Seite auf /something aktualisiere, kümmert sich Flask-App um diesen Anruf und ich erhalte Not Found Fehler.

Was ist die beste Lösung? Ich habe darüber nachgedacht, alle Anrufe umzuleiten, die /api/v1/... nicht an / anrufen. Dies ist nicht ideal, da ich die Startseite meiner App zurückbekomme, nicht die React-Ansicht.

25
knowbody

Wir haben Catch-All-URLs verwendet.

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()

Sie können auch eine weitere Meile zurücklegen und das Flask routing-System wiederverwenden, um path denselben Routen wie der Client zuzuordnen, sodass Sie den Datenclient einbetten können, der als JSON in der HTML-Antwort benötigt wird.

29
Dan Abramov

Vielleicht als Erweiterung zu den Antworten vor. Dies löste das Problem für mich:

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