Nginx gunicorn flask


Hello,

Problem: I cannot configure Nginx to serve my Flask app on a subdomain.

Let me explain the issue.

I have an OVH basic VPS. I can access it via SSH using the CLI, and I use Ubuntu 22.04. I have a working Yunohost installation. I installed some apps like JupyterLab, Yellow, YesWiki, etc., on the main domain and subdomains, all with SSL support, and everything works great.

For a personal learning project, I would like to use my VPS to serve a Flask app.

Step 1: Create a Dummy Flask App

I created a virtual environment, activated it, and installed the necessary modules:

First, I made a dummy Flask app:

  1. Created a directory for the app:
    mkdir /var/www/flask_app

  2. Navigated to the directory:
    cd /var/www/flask_app

  3. Created a virtual environment:
    python3 -m venv venv

  4. Activated the virtual environment:
    source /var/www/flask_app/venv/bin/activate

  5. Installed Flask and Gunicorn:
    pip install flask gunicorn

I then created a simple Flask app in /var/www/flask_app/app.py:

from flask import Flask

app = Flask(__name__)

@app.route('/')
def hello_world():
    return 'Hello, World!'

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

Step 2: Create a Systemd Service File

I created a systemd service file at /etc/systemd/system/flask_app.service:

[Unit]
Description=Gunicorn instance to serve Flask application
After=network.target

[Service]
User=www-data
Group=www-data
WorkingDirectory=/var/www/flask_app
Environment=“PATH=/var/www/flask_app/venv/bin”
ExecStart=/var/www/flask_app/venv/bin/gunicorn --workers 3 --bind unix:/var/www/flask_app/flask_app.sock -m 007 app:app

[Install]
WantedBy=multi-user.target

I then started and enabled the Gunicorn service with the following commands:

sudo systemctl daemon-reload

sudo systemctl restart flask_app

sudo systemctl enable flask_app

I checked the status of the service with sudo systemctl status flask_app, and everything worked great. The service is up and running. The Flask app responds locally as the command curl --unix-socket /var/www/flask_app/flask_app.sock http://localhost/ returns a nice “Hello, World!” response.

Step 3: Configure Nginx

I want this “Hello, World!” message to display in my Firefox browser on any distant computer.

I created a subdomain testraw.rogues.fr through the online Yunohost administration panel. I own the domain rogues.fr at OVH registrar. I ran YHdiagnostic, almost everything is green (just usual email issues), and then I set up an SSL certificate. DNS records are created with the automatic OVH binding system. Everything works fine.

I did not install any application on the subdomain.

In /etc/nginx/conf.d, there is an empty testraw.rogues.fr.d directory and a testraw.rogues.fr.conf file.

That’s where the issue begins. I do not know much about Nginx configuration files.

Problem with Nginx Configuration

In Firefox, https://testraw.rogues.fr keeps redirecting to the rogues.fr Yunohost login page.

I have tried a million different configuration files with the help of ChatGPT. I have another subdomain, datascientist.rogues.fr. I fed ChatGPT with the datascientist.rogues.fr.conf file and /datascientist.rogues.fr.d/yellow__2.conf file for it to get inspiration from, but it doesn’t work.

I spent hours on this, and I am desperate. I haven’t posted on a forum since 1997 asking for support to download MP3 songs with Napster. So, I hope that the format of my question is okay for forums. I am a French native, and I hope my English is understandable.

I would appreciate any clues or help. Thanks in advance!


That’s a little bit unclear.
What you have :

  1. Vps running Ubuntu to serve your app.
  2. Yunohost server. Where? Another vps or at home?
  3. Using the ip address of the vps, do you have access to the app?
  4. Use the redirect app to point to the ip address of your app, using nginx proxy.
  5. It might be doable to make your own package for your app

Hi,
Sorry,
My VPS runs debian, onwhich I set up Yunohost. My VPS is at OVH data center.

My own PC at home runs Ubuntu.

Using the ip address of the vps, do you have access to the app?
=> That is a good question, I did nt try. I will try and tell you (cannot do it right now, I have to redo the whole process as I erased everything on VPS)

Use the redirect app to point to the ip address of your app, using nginx proxy.
=> I dont understand, I will search.

It might be doable to make your own package for your app
=> It sounds very frightening and lot of work ahah

Let me be a bit more clear about my project. Maybe it can help.

I developped a Flask app on my PC for a data science project.
The datascience project is about predicting if a bank customer can reimburse a loan or not.
This flask app takes as an entry a CustomerID, get the feature from the customer on a customer features dataframe, and use a pre trained xgboost model to predict an answer between 1 or 0 (depending on if the customer can have access to a credit, or not).

The app runs on my local computer.

I put this project on git hub and I’m supposed to make the app available for an user (the user is supposed to be a banker). The school advise to use Heroku as a service provider to put the app online. But I would like to use my own VPS instead of Heroku.

What I managed to do :

pull the github files on my VPS, run the flask app on the VPS, I can use and access to the app thru SSH from my own PC in CLI.
What I want is to make the app available for a user from any PC of the world.

If I cannot do this on my YunohostVPS I will use Heroku but I think it is a shame.

Thanks in advance for any advises :slight_smile:

In the yunohost catalog there is an app called redirect. Install it from the webadmin, choose the domain that will point to the ip:port of the app. The type of the redirect is nginx proxy.
Since the app runs on the same machine, the ip will be localhost. You must also serve your app on a custom port.
And if you have some spare time you can have a look at the packaging scripts. It’s easier than you think

Hey @jarod5001 ,

I was able to solve my problem while trying to reinstall the app.

  1. I installed the “my_webapp” app through Yunohost.

  2. I created a dummy Flask app with the route:

    @app.route('/site/flaskapp')
    
  3. I started Gunicorn:

    gunicorn --bind 0.0.0.0:8000 app:app
    
  4. Configuring Nginx was actually easy:
    In /etc/nginx/conf.d/gunicorn.rogues.fr.d/my_webapp.d/flaskapp.conf I wrote:

    location /site/flaskapp {
        proxy_pass http://127.0.0.1:8000;
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
    }
    
  5. Then I restarted Nginx:

    sudo systemctl restart nginx
    

And the app is ONLINE! :partying_face:

Now I will concentrate on installing my own bank prediction app.

Thank you !!!

1 Like

Did you try to install the app without a port?
Because when custom web app gets updated, it will ignore to update nginx config because it’s manually modified.

I see you manage to make it work before I can help you.
I’m the author of the app YunoHost app store | FastAPI which is an app that can be used to run a FastAPI (a concurrent of Flask). So if you want to contribute to my app to be able to choose between FastAPI and Flask during the install, it would be very nice :slight_smile:
Maybe in the source code, you can find some help so : GitHub - YunoHost-Apps/FastAPI_ynh: a YunoHost app to run a custom FastAPI code

@leonarf Great that you managed to fix it! I am hoping to do the same and I was wondering, to retrace your steps:

  • Install my_webapp
  • create a Flask-app
  • start Gunicorn
  • configure nginx

Or would I also need the Systemd service file you described?

Hello, if I understand correctly, you want to run a flask app on yunohost.
If I were you, I would

  1. install my fastApi app
  2. put your flask app code into the same directory as the fastapi example app installed by my application.
  3. Change the launching command (line 13 of FastAPI_ynh/conf/systemd.service at master · YunoHost-Apps/FastAPI_ynh · GitHub) to launch your flask app, instead of the fastapi app

I hope this help you, and if you want to contribute to the app to be able to choose between fastapi et flask, I can help you do so

Hi @leonarf, yes, you are correct. Thanks for your suggestion, I will try this!

Hello, I found an easier solution

  • Install my_webapp
  • With the user created create a directory in /var/www in which you install your flask app
  • have it to on localhost:XXXX
  • Install the redirect app with reverse-proxy from an external url to localhost:XXXX
  • install and start flask as service
  • you’re good to go

Thanks all for your help