Падымаем свой інстанс Webogram з праксіраваннем праз nginx

Прывітанне, Хабр!

Нядаўна я патрапіў у сітуацыю, у якой неабходна было працаваць усярэдзіне карпаратыўнай сеткі з няпоўным доступам да інтэрнэту і як вы можаце здагадацца па загалоўку – Telegram у ёй быў заблакаваны. Упэўнены, што дадзеная сітуацыя знаёмая шматлікім.

Я цалкам магу абыходзіцца без месэнджараў, аднак менавіта Telegram мне патрэбен быў для працы. Усталяваць кліент на працоўную машыну не ўяўлялася магчымым, выкарыстоўваць асабісты наўтбук - таксама. Яшчэ адным рашэннем бачыцца выкарыстоўваць яго афіцыйную вэб-версію, але як вы можаце здагадацца - яна гэтак жа была недаступная. Варыянт з пошукам неафіцыйнага люстэрка я адразу выкрэсліваю (спадзяюся па цалкам відавочным чыннікам).

На шчасце, Webogram – гэта opensource-праект, зыходны код якога даступны ў GitHub яго аўтара (За што вялікі яму дзякуй!)
Сама ўсталёўка і запуск не ўяўляе з сябе нічога складанага, аднак, ва ўмовах эксплуатацыі ўсярэдзіне сетак з заблакаваным доступам да сервераў Telegram вас хутчэй чакае расчараванне, чым поспех, бо вэб-версія адпраўляе запыты на серверы Telegram з машыны карыстача.

Да шчасця, гэта даволі проста (але не вельмі відавочна) выправіць. Жадаю папярэдзіць, што я не з'яўляюцца аўтарам дадзенага рашэння. Мне ўдалося знайсці яго ў галінцы, у якой абмяркоўвалася праблема падобная на маю. Рашэнне, якое прапанаваў карыстальнік github tecknojock, мне вельмі дапамагло, аднак, упэўнены, што яно можа дапамагчы яшчэ каму небудзь, таму рашыўся на напісанне дадзенага тутарыялу.

Пад катом вас чакае пакрокавая настройка свайго люстэрка Webogram і настройка праксіравання яго запытаў да сервераў Telegram з выкарыстаннем nginx.

У якасці прыкладу я абраў толькі што ўсталяваную і абноўленую Ubuntu Server 18.04.3.

Увага: У рамках дадзенага тутарыялу не будзе інструкцый па наладзе дамена ў nginx. Гэта неабходна зрабіць самастойна. Тутарыял мяркуе, што ў вас ужо наладжаны дамен з ssl, а гэтак жа сам сервер, на якім плануецца налада, мае доступ да сервераў Telegram (любым на ваш густ спосабам)

Выкажам здагадку, што ip дадзенага сервера 10.23.0.3, а даменнае імя mywebogram.localhost

Адштурхваючыся ад гэтых умоўнасцяў, я буду прыводзіць прыклады канфігурацый. Не забывайце мяняць значэння на свае.

Такім чынам, прыступім:

Для запуску Webogram, нам патрэбен nodejs. Па змаўчанні, калі ўсталёўваць яго з рэпазітараў Ubuntu - мы атрымаем nodejs версіі 8.x. Нам неабходна 12.x:

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

Выбіраемы месца, дзе будзе грунтавацца наш Webogram.

Для прыкладу - размесцім яго ў корані хатняй дырэкторыі. Для гэтага клануем афіцыйны рэпазітар да сябе на сервер:

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

Наступны крок - усталяваць усе залежнасці, неабходныя для запуску прыкладання:

cd webogram && npm install

Паспрабуем выканаць тэставы запуск. Выканайце каманду:

npm start

Пасля чаго, спрабуем адкрыць у браўзэры

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

Калі да гэтага моманту вы ўсё рабілі правільна - у вас адкрыецца старонка аўтарызацыі Webogram.

Цяпер нам неабходна наладзіць запуск прыкладання ў якасці сэрвісу. Для гэтага створым файл

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

адкрыем яго ў любым рэдактары і надамо наступны выгляд (упісваем свой шлях да 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

Пасля чаго выконваем наступныя каманды:

Ужывальны змены

sudo systemctl daemon-reload

Уключаем аўтазапуск:

sudo systemctl enable webogram.service

Запускаем сэрвіс:

sudo systemctl start webogram.service

Пасля выкананых дзеянняў Webogram працягне быць даступны на порце 8000.

Так як мы будзем наладжваць доступ да нашага Webogram праз nginx - закрыем порт 8000 для запытаў з-за.

Выкарыстоўваны для гэтага ўтыліту udf (ці любы зручны вам спосаб):

sudo ufw deny 8000

На выпадак, калі ўсё ж вырашылі выкарыстоўваць udf, але ён выключаны на серверы - дадаем яшчэ правіл (каб усё не развалілася) і ўключаем udf:

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

Далей, прыступім да змены канфігурацыі nginx.

Як я і папярэджваў вышэй - мяркуецца, што на Вашым серверы ўжо наладжаны дамен з ssl. Звярну Вашу ўвагу толькі на тое, што неабходна будзе дадаць у канфігурацыйны файл дамена для карэктнай працы:


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

Што мы дадаем у канфіг nginx:

  • Змяняны каранёвы location, які будзе праксіраваць запыты на порт 8000, па якім адказвае Webogram
  • Каранёвы location закрываем з дапамогай basic-auth. Гэта чыста сімвалічны крок, каб закрыць наша дадатак ад старонніх вачэй і ботаў. (А гэтак жа каб не было праблем з блакіроўкамі)
  • Куча location з proxy_path на серверы Telegram - гэта як раз нашы эндпаінты, праз якія мы будзем праксіраваць нашы запыты

Гэтак жа, створым файл /etc/nginx/passwd.htpasswd;, Каб nginx было з чым звяраць паролі карыстальнікаў.

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

Падымаем свой інстанс Webogram з праксіраваннем праз nginx

Перазапускаем nginx:

sudo systemctl restart nginx

Цяпер Webogram будзе даступны толькі па адрасе mywebogram.localhost/app/index.html пасля таго, як будуць уведзены лагін і пароль, які вы вызначылі пры стварэнні каманды htpasswd.

Засталося няшмат: унясём невялікія змены ў сам праект.

Адкрыйце ў рэдактары файл ~/webogram/app/js/lib/mtproto.js

І прывядзеце яго пачатак да наступнага выгляду:

/*!
 * 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
      }
...
 

Пасля гэтага, неабходна абнавіць старонку з дадаткам у браўзэры.

Адкрыйце кансоль браўзэра і паглядзіце сеткавыя запыты прыкладання. Калі ўсё працуе, і XHR запыты ідуць на ваш сервер - значыць усё зроблена правільна, і Webogram зараз праксіруецца праз nginx.

Падымаем свой інстанс Webogram з праксіраваннем праз nginx

Спадзяюся, што дадзены тутарыял будзе карысны яшчэ каму-небудзь акрамя мяне.

Вялікі дзякуй усім, хто дачытаў да канца.

Калі ў кагосьці ўзніклі складанасці ці я дапусціў нейкія недакладнасці - з задавальненнем адкажу і пастараюся вам дапамагчы ў каментарах або лс.

Крыніца: habr.com

Дадаць каментар