Search code examples
nginxself-hostingpython-reflex

pynecone self-hosting get websocket error


This is the document for self-hosting In fact, from the document,
I don't quite understand the meaning of each field in pcconfig.py.

Is there any demonstration of self-hosting?
Or is there a more complete official document?

This is mine.

pcconfig.py

config = pc.Config(
    app_name="myapp",
    api_url="http://myhost:8100",
    bun_path="$HOME/.bun/bin/bun",
    db_url="sqlite:///pynecone.db",
)

I use nginx on my website. It gets the error message.

WebSocket connection to 'wss://myhost:8100/event/?EIO=4&transport=websocket' failed

I don't know what's going on, but it just won't work,
and I can't quite make out what the file says.

Is anything wrong on my pcconfig.py?
Do you have any suggestion?

Thanks.


Solution

  • Here, I can share my experience of the self-hosting by nginx briefly. And if you want to have detailed information, you can read this article.

    Scenario

    My Resources

    • I only have a host with the IP 111.123.xxx.33. (In my real case, I run on the linode and it is fully linux)
    • In the host, it can fully run pynecone project well.
    • My domain name is mydomain.net
    • I already have my SSL certificate /xxx/xxx/fullchain.pem and /xxx/xxx/privkey.pem. (In my real case, I use Let's Encrypt SSL and managed by Certbot every 3 months)
    • I can setup my DNS for my domain name. (In my real case, I use router-53)
    • In the host, no one use ports 3711 and 8701.

    My Goal

    For a pinecone project, it will finally build to frontend part and backend part. And I hope to achieve the following goal.

    • I only want to run frontend and backend on one host with IP 111.123.xxx.33.
    • User can open my service from https://xxxxx-frontend.mydomain.net
    • I hope pynecone's frontend run on port 3711
    • I hope pynecone's backend run on port 8701

    To achieve this goal with the current resource, we have the following 3 steps to complete this mission.

    1. DNS Setting

    my host's IP is 111.123.xxx.33
    And I can add the two A record on DNS.

    • xxxxx-frontend.mydomain.net -> 111.123.xxx.33
    • xxxxx-backend.mydomain.net -> 111.123.xxx.33

    The two domain is with the same IP

    2. Pynecone Project

    pcconfig.py

    import pynecone as pc
    my_deploy_config = pc.Config(
        app_name="myapp",
        port=3711,
        backend_port=8701,
        api_url="https://xxxxx-backend.mydomain.net",
        bun_path="$HOME/.bun/bin/bun",
        db_url="sqlite:///pynecone.db",
        env=pc.Env.PROD,
    )
    config = my_deploy_config
    

    This file give the following information.

    • frontend will service in http://localhost:3711
    • backend will service in http://localhost:8701
    • The frontend’s source code will communicate with the backend on https://xxxxx-backend.mydomain.net

    pc commands to start project

    • pc init
    • pc run

    3. Nginx Setting

    /etc/nginx/nginx.conf

    Insert the following to include the setting.

    include /somepath/my-nginx-sites-enabled/*
    

    /somepath/my-nginx-sites-enabled/xxxxx-backend.mydomain.net

    server{
        server_name xxxxx-backend.mydomain.net;
        location / {
            proxy_pass http://localhost:8701;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header Host $host;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "upgrade";
            proxy_redirect off;
       }
        listen 443 ssl; # managed by Certbot
        ssl_certificate /xxx/xxx/fullchain.pem; # managed by Certbot
        ssl_certificate_key /xxx/xxx/privkey.pem; # managed by Certbot
    }
    

    The above set the following 4 things.

    • SSL support
    • fully WebSocket Support
    • HTTP support
    • xxxxx-backend.mydomain.net -> http://localhost:8701
      (this is pynecone's backend according to your pcconfig.py)

    /somepath/my-nginx-sites-enabled/xxxxx-frontend.mydomain.net

    server{
        server_name xxxxx-frontend.mydomain.net;
        location / {
            proxy_pass http://localhost:3711;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header Host $host;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "upgrade";
            proxy_redirect off;
        }
        listen 443 ssl; # managed by Certbot
        ssl_certificate /xxx/xxx/fullchain.pem; # managed by Certbot
        ssl_certificate_key /xxx/xxx/privkey.pem; # managed by Certbot
    }
    

    The above set the following 4 things.

    • SSL support
    • fully WebSocket Support
    • HTTP support
    • xxxxx-frontend.mydomain.net -> http://localhost:3711 (this is pynecone's frontend according to your pcconfig.py)