Itinaas namin ang aming Webogram instance sa pamamagitan ng proxying sa pamamagitan ng nginx

Hoy Habr!

Kamakailan ay natagpuan ko ang aking sarili sa isang sitwasyon kung saan kinakailangan na magtrabaho sa loob ng isang corporate network na may hindi kumpletong pag-access sa Internet at, tulad ng maaari mong hulaan mula sa pamagat, ang Telegram ay naharang dito. Sigurado ako na ang sitwasyong ito ay pamilyar sa marami.

Magagawa ko nang walang mga instant messenger, ngunit ito ay Telegram na kailangan ko para sa trabaho. Hindi posibleng i-install ang kliyente sa isang work machine, at hindi rin posible na gumamit ng personal na laptop. Ang isa pang solusyon ay tila gamitin ito opisyal na bersyon sa web, ngunit tulad ng maaari mong hulaan, hindi rin ito magagamit. Agad kong tinawid ang opsyon ng paghahanap para sa isang hindi opisyal na salamin (umaasa ako para sa mga malinaw na dahilan).

Sa kabutihang palad, ang Webogram ay isang open source na proyekto kung saan available ang source code github may-akda nito (Para saan maraming salamat sa kanya!)
Ang pag-install at paglunsad mismo ay hindi mahirap, gayunpaman, sa mga kondisyon ng pagpapatakbo sa loob ng isang network na may naka-block na pag-access sa mga server ng Telegram, mas malamang na mabigo ka kaysa sa matagumpay, dahil ang bersyon ng web ay nagpapadala ng mga kahilingan sa mga server ng Telegram mula sa makina ng gumagamit.

Sa kabutihang palad, ito ay isang medyo simple (ngunit hindi masyadong halata) na pag-aayos. Gusto kong balaan ka na hindi ako ang may-akda ng solusyong ito. Nagawa kong hanapin ito sa sangay, na tinalakay ang isang problemang katulad ng sa akin. Solusyon na iminungkahi ng gumagamit ng github tecknojock, malaki ang naitulong nito sa akin, gayunpaman, sigurado akong makakatulong ito sa ibang tao, kaya nagpasya akong isulat ang tutorial na ito.

Sa ibaba ng cut ay makikita mo ang sunud-sunod na pag-setup ng iyong Webogram mirror at pag-setup ng pag-proxy ng mga kahilingan nito sa mga server ng Telegram gamit ang nginx.

Bilang halimbawa, pumili ako ng bagong naka-install at na-update na Ubuntu Server 18.04.3.

Babala: Ang tutorial na ito ay hindi magsasama ng mga tagubilin sa pag-set up ng isang domain sa nginx. Kailangan mong gawin ito sa iyong sarili. Ipinapalagay ng tutorial na na-configure mo na ang isang domain na may ssl, at ang server mismo kung saan plano mong i-configure ito ay may access sa mga server ng Telegram (sa anumang paraan na gusto mo)

Ipagpalagay natin na ang ip ng server na ito ay 10.23.0.3, at ang domain name ay mywebogram.localhost

Batay sa mga kombensyong ito, magbibigay ako ng mga halimbawa ng mga pagsasaayos. Huwag kalimutang baguhin ang mga halaga sa iyong sarili.

Kaya magsimula tayo:

Upang patakbuhin ang Webogram, kailangan namin ng mga nodej. Bilang default, kung i-install namin ito mula sa mga repositoryo ng Ubuntu, makakakuha kami ng nodejs na bersyon 8.x. Kailangan namin ng 12.x:

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

Pinipili namin ang lugar kung saan ibabatay ang aming Webogram.

Halimbawa, ilagay natin ito sa root ng home directory. Upang gawin ito, i-clone ang opisyal na imbakan sa aming server:

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

Ang susunod na hakbang ay i-install ang lahat ng mga dependency na kinakailangan upang patakbuhin ang application:

cd webogram && npm install

Subukan natin ang isang test run. Patakbuhin ang utos:

npm start

Pagkatapos nito, sinubukan naming buksan ito sa browser

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

Kung hanggang sa puntong ito ay nagawa mo nang tama ang lahat, magbubukas ang pahina ng awtorisasyon sa Webogram.

Ngayon kailangan nating i-configure ang application upang tumakbo bilang isang serbisyo. Para magawa ito, gumawa tayo ng file

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

buksan ito sa anumang editor at bigyan ito ng sumusunod na hitsura (ipasok ang iyong landas sa WorkDirectory)

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

Pagkatapos ay pinapatakbo namin ang sumusunod na mga utos:

Paglalapat ng mga pagbabago

sudo systemctl daemon-reload

Paganahin ang autorun:

sudo systemctl enable webogram.service

Simulan natin ang serbisyo:

sudo systemctl start webogram.service

Pagkatapos makumpleto ang mga hakbang, ang Webogram ay patuloy na magiging available sa port 8000.

Dahil magse-set up kami ng access sa aming Webogram sa pamamagitan ng nginx, isasara namin ang port 8000 para sa mga kahilingan mula sa labas.

Ginagamit namin ang udf utility para dito (o anumang paraan na maginhawa para sa iyo):

sudo ufw deny 8000

Kung sakaling magpasya ka pa ring gumamit ng udf, ngunit ito ay hindi pinagana sa server, magdagdag ng higit pang mga panuntunan (upang ang lahat ay hindi masira) at paganahin ang udf:

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

Susunod, simulan nating baguhin ang pagsasaayos ng nginx.

Gaya ng binalaan ko sa itaas, ipinapalagay na ang isang domain na may ssl ay na-configure na sa iyong server. Dadalhin ko lang ang iyong pansin sa kung ano ang kailangang idagdag sa file ng pagsasaayos ng domain para gumana ito nang tama:

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;
  }
}

Ano ang idinagdag namin sa nginx config:

• Binago namin ang root location, na mag-proxy ng mga kahilingan sa port 8000, kung saan tumugon ang Webogram
• Isinasara namin ang root location gamit ang basic-auth. Ito ay isang purong simbolikong hakbang upang isara ang aming aplikasyon mula sa prying eyes at bots. (At din para maiwasan ang mga problema sa pagharang)
• Ang isang grupo ng mga lokasyon na may proxy_path sa Telegram server ay eksakto ang aming mga endpoint kung saan namin i-proxy ang aming mga kahilingan

Gayundin, gumawa tayo ng isang file /etc/nginx/passwd.htpasswd;upang ang nginx ay mayroong isang bagay upang suriin ang mga password ng gumagamit.

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

I-restart ang nginx:

sudo systemctl restart nginx

Ngayon ang Webogram ay magagamit lamang sa mywebogram.localhost/app/index.html pagkatapos maipasok ang pag-login at password na tinukoy mo noong lumilikha ng htpasswd command.

Kaunti na lang ang natitira: gagawa kami ng maliliit na pagbabago sa mismong proyekto.

Buksan ang file sa isang editor ~/webogram/app/js/lib/mtproto.js

At dalhin ang simula nito sa sumusunod na anyo:

/*!
 * Webogram v0.7.0 - messaging web application for MTProto
 * https://github.com/zhukov/webogram
 * Copyright (C) 2014 Igor Zhukov <[email protected]>
 * 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
      }
...
 

Pagkatapos nito, kailangan mong i-refresh ang pahina ng application sa browser.

Buksan ang iyong browser console at tingnan ang mga kahilingan sa network ng application. Kung gumagana ang lahat at mapupunta ang mga kahilingan ng XHR sa iyong server, tapos na ang lahat nang tama, at na-proxi na ngayon ang Webogram sa pamamagitan ng nginx.

Umaasa ako na ang tutorial na ito ay magiging kapaki-pakinabang sa ibang tao maliban sa akin.

Maraming salamat sa lahat ng nagbasa hanggang dulo.

Kung sinuman ang nahihirapan o gumawa ako ng anumang mga kamalian, ikalulugod kong sagutin at subukang tulungan ka sa mga komento o sa PM.

Pinagmulan: www.habr.com