Write a Guide on hosting Gradio apps locally (+ with nginx)

[abidlabs]

There have been lots of questions about how to set up and host Gradio locally (i.e. on your own AWS server, potentially with nginx for reverse proxying). I've generally been referring people to this blog post: https://abidlabs.medium.com/quickly-deploying-gradio-on-aws-242af2374784

But:

• It would be good to get this onto our website
• It would be good to add a section on setting this up with nginx as it's a little tricky as additional routes need to be set up for websockets

[prodigy]

I just stumbled upon this on the hunt for a proper explanation on how to reverse proxy gradio apps. I get a million errors stating DOMException: Failed to execute 'define' on 'CustomElementRegistry': the name "gradio-app" has already been used with this registry. But when running locally all is fine. So I assume my nginx configuration is faulty.

You say "it's a little tricky as additional routes need to be set up". Can you please kindly provide a nginx configuration example for the time being? 😊

I'm running automatic1111 in case it matters.

I just use Nginx Proxy Manager and it generated this configuration:

server {
  set $forward_scheme http;
  set $server         "10.241.2.1";
  set $port           7860;

  listen 80;
listen [::]:80;

listen 443 ssl http2;
listen [::]:443 ssl http2;

  server_name MY_SERVER_NAME;

  # Let's Encrypt SSL
  include conf.d/include/letsencrypt-acme-challenge.conf;
  include conf.d/include/ssl-ciphers.conf;
  ssl_certificate /etc/letsencrypt/live/npm-7/fullchain.pem;
  ssl_certificate_key /etc/letsencrypt/live/npm-7/privkey.pem;

    # Force SSL
    include conf.d/include/force-ssl.conf;

proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection $http_connection;
proxy_http_version 1.1;

  access_log /data/logs/proxy-host-5_access.log proxy;
  error_log /data/logs/proxy-host-5_error.log warn;

  location / {
    proxy_set_header Host $host;
    proxy_set_header X-Forwarded-Scheme $scheme;
    proxy_set_header X-Forwarded-Proto  $scheme;
    proxy_set_header X-Forwarded-For    $remote_addr;
    proxy_set_header X-Real-IP		$remote_addr;
    proxy_pass       http://10.241.2.1:7860;

    # Force SSL
    include conf.d/include/force-ssl.conf;

    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection $http_connection;
    proxy_http_version 1.1;
  }
}```