Let's say you have two different routes in the same Python Flask app, perhaps foo and bar.
from flask import Blueprint, render_template
blueprint = Blueprint('demo', __name__)
@blueprint.route('/foo')
def foo():
return render_template('foo.html')
@blueprint.route('/bar')
def foo():
return render_template('bar.html')
And foo.html prints Hello and bar.html prints World. Since these are in the same Flask app, you can use Jinja include to include HTML. For example, the following in foo.html will include bar.html.
{% include 'bar.html' %}
Let's say you have you have two different routes in different Python Flask app, perhaps foo app "a".
from flask import Blueprint, render_template
blueprint = Blueprint('demo', __name__)
@blueprint.route('/foo')
def foo():
return render_template('foo.html')
And bar in app "b".
from flask import Blueprint, render_template
blueprint = Blueprint('demo', __name__)
@blueprint.route('/bar')
def foo():
return render_template('bar.html')
Let's say app's a and b can be requested at the following URLs.
- app a - foo.example.com
- app b - bar.example.com
In this scenario, CORS and jQuery can be used to include bar in app "b" in app "a".
First, app "b" will need to be configured will CORS so that app "a" is allowed to fetch app "b".
FreeKB - Flask - Resolve "Access to fetch has been blocked by CORS policy"
In __init__.py in app "b" import CORS and init app with CORS.
from flask_cors import CORS
def app():
app = Flask(__name__)
CORS(app)
return app
In app "b" bar route, decorate the route to allow requests from app "a".
from flask_cors import cross_origin
@app.route('/bar', methods=['POST'])
@cross_origin(origins='http://foo.example.com')
def bar():
return render_template('bar.html')
Now in app "a", let's use jQuery to include the /bar route from app b.
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
</head>
<body>
<div id="content-area">
</div>
<script>
$(document).ready(function(){
$("#content-area").load("http://bar.example.com/bar");
});
</script>
</body>
</html>
Did you find this article helpful?
If so, consider buying me a coffee over at 