How to integrate Flask within ERPNEXT

ERPNext
,
1

I want to show one html content in a new path in same application. So that I can give that path in the iframe to ERPNEXT page js. I have added some controls in the result of html content from python. So how to integrate flask with ERPNEXT.

2

Here’s a step-by-step guide to achieve this:

Step 1: Set Up Your Flask Application

Make sure you have Flask installed:

bash:

pip install Flask

Create a basic Flask application in app.py:

Python:


from flask import Flask, render_template, request

app = Flask(__name__)

@app.route('/')
def home():
    return "Main Flask App"

@app.route('/custom-content')
def custom_content():
    # Add your custom controls and logic here
    return render_template('custom_content.html')

if __name__ == '__main__':
    app.run(debug=True)

Create a folder named templates and inside it, create a file named custom_content.html:

HTML:

<!DOCTYPE html>
<html>
<head>
    <title>Custom Content</title>
</head>
<body>
    <h1>Custom Content from Flask</h1>
    <!-- Add your custom controls here -->
    <form action="/submit" method="post">
        <label for="input">Input:</label>
        <input type="text" id="input" name="input">
        <button type="submit">Submit</button>
    </form>
</body>
</html>

Step 2: Run Your Flask Application

Start your Flask app by running:

bash:

python app.py

Your Flask app should now be running on http://127.0.0.1:5000/.

Step 3: Integrate Flask with ERPNEXT

  1. Create a Custom Page in ERPNEXT:
  • In ERPNEXT, go to the Desk module and create a new custom page or do it programmatically using a custom app.
  • Navigate to Setup > Custom Page and create a new page.
  1. Embed the Flask Content Using an iframe:
  • Edit the custom page and insert an iframe that points to your Flask route.

For example, in the ERPNEXT custom page HTML editor, you can add something like this:

HTML :

<!DOCTYPE html>
<html>
<head>
    <title>Custom Page with Flask Content</title>
</head>
<body>
    <h1>ERPNEXT Page with Embedded Flask Content</h1>
    <iframe src="http://127.0.0.1:5000/custom-content" style="width:100%; height:600px; border:none;"></iframe>
</body>
</html>

Step 4: Adjust Flask for Cross-Origin Resource Sharing (CORS)

To ensure that your Flask application can be embedded in an iframe on a different domain (if applicable), you might need to handle CORS (Cross-Origin Resource Sharing). Install Flask-CORS:

bash:

pip install flask-cors

Update your Flask app to use Flask-CORS:

Python:

from flask import Flask, render_template, request
from flask_cors import CORS

app = Flask(__name__)
CORS(app)

@app.route('/')
def home():
    return "Main Flask App"

@app.route('/custom-content')
def custom_content():
    return render_template('custom_content.html')

if __name__ == '__main__':
    app.run(debug=True)