Feltesszük a Webogram instanciánkat nginx-en keresztüli proxyzással

Helló, Habr!

Nemrég olyan helyzetbe kerültem, amikor a vállalati hálózaton belül kellett dolgoznom, ahonnan korlátozott internet-hozzáférés állt rendelkezésre, és ahogy a címből is kiderül, a Telegram blokkolva volt. Biztos vagyok benne, hogy sokan ismerik ezt a helyzetet.

Teljesen meg tudom oldani akár a messenger nélküli létezést is, de a Telegramra szükségem volt a munkához. Nem volt lehetőségem klienst telepíteni a munkahelyi gépre, a saját laptopomat pedig használni sem tudtam. Egy újabb megoldásként gondoltam arra, hogy a hivatalos webes verziót, de ahogy azt el tudjátok képzelni, ez sem volt elérhető. Az opciót, hogy nem hivatalos tükörhelyet keressek, azonnal kijelöltem (remélem, elég nyilvánvaló okokból).

Szerencsére a Webogram egy nyílt forráskódú projekt, amelynek forráskódja elérhető github a szerzője által (Neki hatalmas köszönet!)
A telepítés és a futtatás nem bonyolult, viszont ha egy, a Telegram szervereihez blokkolt hozzáférésű hálózaton működteted, inkább csalódásra, mintsem sikerre számíthatsz, mivel a webes verzió a felhasználó gépéről küld kéréseket a Telegram szerverekhez.

Szerencsére ezt meglehetősen egyszerű (de nem annyira nyilvánvaló) megoldani. Szeretném figyelmeztetni, hogy nem én vagyok a megoldás szerzője. Ezt sikerült megtalálnom egy szálban, amelyben egy hasonló problémát tárgyaltak. A megoldás, amelyet a github felhasználó tecknojock, nekem sokat segített, viszont biztos vagyok benne, hogy másoknak is segíthet, ezért írtam ezt a tutorialt.

A továbbiakban lépésről lépésre bemutatom, hogyan állíthatjátok be a saját Webogram tükröt, és hogyan lehet az ő kéréseiket a Telegram szerverekhez proxyzni nginx használatával.

Például a frissen telepített és frissített Ubuntu Server 18.04.3-at választottam.

Figyelem: A tutorial során nem lesznek irányelvek a domain nginx-be való beállításához. Ezt magatoknak kell elvégezni. A tutorial azt feltételezi, hogy már beállítottatok egy domaint SSL-lel, és hogy a szerver, amelyen a konfigurációra kerül sor, hozzáfér a Telegram szerverekhez (akárhogy is szeretnétek).

Tegyük fel, hogy a szerver IP-címe 10.23.0.3, míg a domain neve mywebogram.localhost.

Ezeket a feltételezéseket alapul véve, példákat fogok mutatni a konfigurációkról. Ne felejtsétek el megváltoztatni az értékeket a sajátjaitokra.

Nos, kezdjük el:

A Webogram indításához szükség van nodejs-re. Alapértelmezés szerint, ha az Ubuntu tárolókból telepítjük, a nodejs 8.x verzióját kapjuk. Nekünk a 12.x verzió szükséges:

curl -sL https://deb.nodesource.com/setup_12.x | sudo -E bash - 
sudo apt update && sudo apt -y install nodejs

Válassza ki a helyet, ahol a Webogramot kívánjuk elhelyezni.

Példaként a saját mappánk gyökerében helyezkedik el. Ehhez klónozzuk a hivatalos tárolót a szerverünkre:

cd ~ && git clone https://github.com/zhukov/webogram.git

A következő lépés az összes szükséges függőség telepítése az alkalmazás futtatásához:

cd webogram && npm install

Próbáljuk meg a tesztindítást. Futtassa a következő parancsot:

npm start

Ezt követően próbáljuk meg megnyitni böngészőben.

 http://10.23.0.3:8000/app/index.html

Ha eddig mindent jól csinált, megnyílik a Webogram bejelentkezési oldala.

Most szükségünk van az alkalmazás szolgáltatásként történő indításának beállítására. Ehhez létrehozunk egy fájlt:

sudo touch /lib/systemd/system/webogram.service

Megnyitjuk azt bármilyen szövegszerkesztőben, és a következő formát adjuk neki (írja be a saját WorkDirectory-ját):

[Unit]
Description=Webogram tükör
[Service]
WorkingDirectory=/home/tg/webogram
ExecStart=/usr/bin/npm start
SuccessExitStatus=143
TimeoutStopSec=10
Restart=on-failure
RestartSec=5
[Install]
WantedBy=multi-user.target

Ezután futtassa a következő parancsokat:

Alkalmazza a változtatásokat.

sudo systemctl daemon-reload

Engedélyezzük az automatikus indítást:

sudo systemctl enable webogram.service

Indítjuk a szolgáltatást:

sudo systemctl start webogram.service

A végrehajtott lépésekkel a Webogram elérhető lesz a 8000-es porton.

Mivel a Webogramunkhoz való hozzáférést nginx-en keresztül fogjuk beállítani, lezárjuk a 8000-es portot a külső kérések elől.

Ehhez használjuk az udf segédprogramot (vagy bármilyen más, Ön által preferált módszert):

sudo ufw deny 8000

Ha esetleg úgy döntene, hogy az udf-t használja, de az ki van kapcsolva a szerveren, további szabályokat adunk hozzá (hogy minden ne hulljon szét), és engedélyezzük az udf-t:

sudo ufw allow ssh
sudo ufw allow 80
sudo ufw allow 443
sudo ufw enable

Következő lépésként a nginx konfigurációjának módosítására térünk rá.

Ahogy már korábban figyelmeztettem, feltételezzük, hogy a szerverén már be van állítva egy domain SSL-lel. Csak arra szeretném felhívni a figyelmét, hogy a domain konfigurációs fájljához hozzá kell adni a helyes működés érdekében:

server {
...
  location ^~ /pluto/apiw1/ {
    proxy_pass https://pluto.web.telegram.org/apiw1/;
  }
  location ^~ /venus/apiw1/ {
    proxy_pass https://venus.web.telegram.org/apiw1/;
  }
  location ^~ /aurora/apiw1/ {
    proxy_pass https://aurora.web.telegram.org/apiw1/;
  }
  location ^~ /vesta/apiw1/ {
    proxy_pass https://vesta.web.telegram.org/apiw1/;
  }
  location ^~ /flora/apiw1/ {
    proxy_pass https://flora.web.telegram.org/apiw1/;
  }
  location ^~ /pluto-1/apiw1/ {
    proxy_pass https://pluto-1.web.telegram.org/apiw1/;
  }
  location ^~ /venus-1/apiw1/ {
    proxy_pass https://venus-1.web.telegram.org/apiw1/;
  }
  location ^~ /aurora-1/apiw1/ {
    proxy_pass https://aurora-1.web.telegram.org/apiw1/;
  }
  location ^~ /vesta-1/apiw1/ {
    proxy_pass https://vesta-1.web.telegram.org/apiw1/;
  }
  location ^~ /flora-1/apiw1/ {
    proxy_pass https://flora-1.web.telegram.org/apiw1/;
  }
  location ^~ /DC1/ {
    proxy_pass http://149.154.175.10:80/;
  }
  location ^~ /DC2/ {
    proxy_pass http://149.154.167.40:80/;
  }
  location ^~ /DC3/ {
    proxy_pass http://149.154.175.117:80/;
  }
  location ^~ /DC4/ {
    proxy_pass http://149.154.175.50:80/;
  }
  location ^~ /DC5/ {
    proxy_pass http://149.154.167.51:80/;
  }
  location ^~ /DC6/ {
    proxy_pass http://149.154.175.100:80/;
  }
  location ^~ /DC7/ {
    proxy_pass http://149.154.167.91:80/;
  }
  location ^~ /DC8/ {
    proxy_pass http://149.154.171.5:80/;
  }
 location / {
    auth_basic "tg";
    auth_basic_user_file /etc/nginx/passwd.htpasswd;
    proxy_pass http://localhost:8000/;
    proxy_read_timeout 90s;
    proxy_connect_timeout 90s;
    proxy_send_timeout 90s;
    proxy_set_header Host $http_host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $remote_addr;
  }
}

Mit adunk hozzá a nginx konfigurációhoz:

• Megváltoztatjuk a gyökér helyet, amely proxizni fogja a 8000-es porton érkező kéréseket, amelyen a Webogram válaszol.
• A gyökér helyet alapvető hitelesítéssel zárjuk le. Ez csupán egy szimbolikus lépés, hogy megvédjük alkalmazásunkat a kíváncsi szemektől és botoktól. (Ily módon elkerülhetjük a blokkolással kapcsolatos problémákat is.)
• A sok hely, amely proxy_path-t tartalmaz a Telegram szervereire — ezek a végpontjaink, amelyeken keresztül proxizni fogjuk a kéréseinket.

Ezenkívül létrehozunk egy fájlt /etc/nginx/passwd.htpasswd;, hogy a nginx-nek legyen, amivel ellenőrizheti a felhasználók jelszavait.

sudo apt install apache2-utils
sudo htpasswd -c /etc/nginx/passwd.htpasswd tg

Újraindítjuk a nginxt:

sudo systemctl restart nginx

Most a Webogram csak a következő címen lesz elérhető: mywebogram.localhost/app/index.html miután megadták a felhasználónevet és a jelszót, amelyet a htpasswd parancs létrehozásakor megadtak.

Még egy kicsit: tarkítsunk meg apró változtatásokat magában a projektben.

Nyissa meg a szerkesztőben a fájlt ~/webogram/app/js/lib/mtproto.js

És állítsa az elejét a következőképpen:

/*!
 * Webogram v0.7.0 - messaging web application for MTProto
 * https://github.com/zhukov/webogram
 * Copyright (C) 2014 Igor Zhukov <igor.beatle@gmail.com>
 * https://github.com/zhukov/webogram/blob/master/LICENSE
 */

angular.module('izhukov.mtproto', ['izhukov.utils'])

  .factory('MtpDcConfigurator', function () {
    var sslSubdomains = ['pluto', 'venus', 'aurora', 'vesta', 'flora']

    var dcOptions = Config.Modes.test
      ? [
        {id: 1, host: 'mywebogram.localhost/DC1',  port: 80},
        {id: 2, host: 'mywebogram.localhost/DC2',  port: 80},
        {id: 3, host: 'mywebogram.localhost/DC3', port: 80}
      ]
      : [
        {id: 1, host: 'mywebogram.localhost/DC4',  port: 80},
        {id: 2, host: 'mywebogram.localhost/DC5',  port: 80},
        {id: 3, host: 'mywebogram.localhost/DC6', port: 80},
        {id: 4, host: 'mywebogram.localhost/DC7',  port: 80},
        {id: 5, host: 'mywebogram.localhost/DC8',   port: 80}
      ]

    var chosenServers = {}

    function chooseServer (dcID, upload) {
      if (chosenServers[dcID] === undefined) {
        var chosenServer = false,
          i, dcOption

        if (Config.Modes.ssl || !Config.Modes.http) {
          var subdomain = sslSubdomains[dcID - 1] + (upload ? '-1' : '')
          var path = Config.Modes.test ? 'apiw_test1' : '/apiw1/'
          chosenServer = 'https://mywebogram.localhost/' + subdomain + path
          return chosenServer
        }
       for (i = 0; i < dcOptions.length; i++) {
          dcOption = dcOptions[i]
          if (dcOption.id == dcID) {
            chosenServer = 'http://' + dcOption.host + '/apiw1'
            break
          }
        }
        chosenServers[dcID] = chosenServer
      }
...
 

Ezt követően frissíteni kell a böngészőben az alkalmazás oldalát.

Nyissa meg a böngésző konzolját, és nézze meg az alkalmazás hálózati kéréseit. Ha minden jól működik, és az XHR kérések a szerverére érkeznek — akkor biztos, hogy jól csináltuk, és a Webogram mostantól a nginx-en keresztül proxizva van.

Remélem, hogy ez a tutorial másoknak is hasznos lesz, nem csupán nekem.

Nagyon köszönöm mindenkinek, aki végigolvasta.

Ha valakinek nehézségei adódtak, vagy valamilyen pontatlanságot vétettem — szívesen válaszolok és próbálok segíteni a hozzászólásokban vagy üzenetben.

Forrás: habr.com