// Tutorial //

Настройка код-серверной облачной IDE-платформы в Ubuntu 18.04 [Краткое руководство]

Published on January 29, 2020
Default avatar
By Savic
Developer and author at DigitalOcean.
Русский
Настройка код-серверной облачной IDE-платформы в Ubuntu 18.04 [Краткое руководство]

Введение

Код-серверная IDE — это код Microsoft Visual Studio Code, запущенный на удаленном сервере и доступный напрямую из браузера. Это означает, что вы можете использовать различные устройства, работающие под управлением различных операционных систем, и всегда иметь под рукой постоянную среду разработки.

В этом обучающем руководстве вы настроите код-серверную облачную IDE-платформу на компьютере с Ubuntu 18.04 и сделаете ее доступной на вашем домене, защищенном с помощью Let’s Encrypt. Более подробную версию этого обучающего руководства см. в статье Настройка код-серверной облачной IDE-платформы в Ubuntu 18.04.

Предварительные требования

  • Сервер с Ubuntu 18.04 и не менее чем 2 ГБ оперативной памяти, root-доступ и учетная запись sudo без прав root. Вы можете выполнить настройку, следуя указаниям документа Начальная настройка сервера для Ubuntu 18.04.

  • Nginx, установленный на сервере. Выполните шаги 1–4 руководства по установке Nginx в Ubuntu 18.04.

  • Полное зарегистрированное доменное имя для размещения код-сервера, указывающее на ваш сервер. В этом обучающем руководстве мы будем использовать имя code-server.your-domain. Вы можете купить доменное имя на Namecheap, получить его бесплатно на Freenom или воспользоваться услугами любого предпочитаемого регистратора доменных имен.

  • На вашем сервере должны быть настроены обе нижеследующие записи DNS. В руководстве Введение в DigitalOcean DNS содержится подробная информация по их добавлению.

    • Запись A, где your-domain указывает на публичный IP-адрес вашего сервера.
    • Запись A, где your-domain указывает на публичный IP-адрес вашего сервера.

Шаг 1 — Установка код-серверной IDE

Создайте каталог для хранения всех данных код-серверной IDE:

  1. mkdir ~/code-server

Перейдите в каталог:

  1. cd ~/code-server

Посетите страницу релизов Github код-серверной IDE и выберите последнюю сборку Linux. Загрузите ее с помощью следующей команды:

  1. wget https://github.com/cdr/code-server/releases/download/2.1692-vsc1.39.2/code-server2.1692-vsc1.39.2-linux-x86_64.tar.gz

Распакуйте архив:

  1. tar -xzvf code-server2.1692-vsc1.39.2-linux-x86_64.tar.gz

Перейдите в каталог, содержащий исполняемый файл код-серверной IDE:

  1. cd code-server2.1692-vsc1.39.2-linux-x86_64

Чтобы получить доступ к исполняемому файлу в вашей системе, скопируйте его с помощью:

  1. sudo cp code-server /usr/local/bin

Создайте папку для код-серверной IDE для хранения пользовательских данных:

  1. sudo mkdir /var/lib/code-server

Создайте службу systemd, code-server.service, в каталоге /lib/systemd/system:

  1. sudo nano /lib/systemd/system/code-server.service

Добавьте следующие строки:

/lib/systemd/system/code-server.service
[Unit]
Description=code-server
After=nginx.service

[Service]
Type=simple
Environment=PASSWORD=your_password
ExecStart=/usr/local/bin/code-server --host 127.0.0.1 --user-data-dir /var/lib/code-server --auth password
Restart=always

[Install]
WantedBy=multi-user.target
  • --host 127.0.0.1 привязывает ее к localhost.
  • --user-data-dir /var/lib/code-server задает каталог пользовательских данных.
  • --auth password указывает, что для аутентификации посетителей используется пароль.

Обязательно замените your_password на желаемый пароль.

Сохраните и закройте файл.

Запустите службу код-серверной IDE:

  1. sudo systemctl start code-server

Убедитесь, что она запущена корректно:

  1. sudo systemctl status code-server

Результат будет выглядеть примерно так:

Output
● code-server.service - code-server Loaded: loaded (/lib/systemd/system/code-server.service; disabled; vendor preset: enabled) Active: active (running) since Mon 2019-12-09 20:07:28 UTC; 4s ago Main PID: 5216 (code-server) Tasks: 23 (limit: 2362) CGroup: /system.slice/code-server.service ├─5216 /usr/local/bin/code-server --host 127.0.0.1 --user-data-dir /var/lib/code-server --auth password └─5240 /usr/local/bin/code-server --host 127.0.0.1 --user-data-dir /var/lib/code-server --auth password ...

Активируйте код-серверную службу для автоматического запуска после перезагрузки сервера:

  1. sudo systemctl enable code-server

Шаг 2 — Публикация код-серверной IDE

Теперь мы настроим Nginx в качестве обратного прокси для код-серверной IDE.

Создайте code-server.conf для хранения конфигурации для публикации код-серверной IDE на вашем домене:

  1. sudo nano /etc/nginx/sites-available/code-server.conf

Добавьте следующие строки для настройки серверного блока, используя необходимые директивы:

/etc/nginx/sites-available/code-server.conf
server {
	listen 80;
	listen [::]:80;

	server_name code-server.your_domain;

	location / {
		proxy_pass http://localhost:8080/;
		proxy_set_header Upgrade $http_upgrade;
		proxy_set_header Connection upgrade;
		proxy_set_header Accept-Encoding gzip;
	}
}

Замените code-server.your_domain на желаемый домен, а затем сохраните и закройте файл.

Чтобы сделать данную конфигурацию сайта активной, создайте символьную ссылку:

  1. sudo ln -s /etc/nginx/sites-available/code-server.conf /etc/nginx/sites-enabled/code-server.conf

Проверьте валидность конфигурации:

  1. sudo nginx -t

Вывод должен выглядеть так:

Output
nginx: the configuration file /etc/nginx/nginx.conf syntax is ok nginx: configuration file /etc/nginx/nginx.conf test is successful

Чтобы новая конфигурация вступила в силу, перезапустите Nginx:

  1. sudo systemctl restart nginx

Шаг 3 — Защита вашего домена

Теперь вы должны обеспечить защиту вашего домена с помощью TLS-сертификата Let’s Encrypt.

Добавьте хранилище пакетов Certbot на ваш сервер:

  1. sudo add-apt-repository ppa:certbot/certbot

Установите Certbot и его плагин Nginx:

  1. sudo apt install python-certbot-nginx

Настройте ufw для принятия шифрованного трафика:

  1. sudo ufw allow https

Результат будет выглядеть следующим образом:

Output
Rule added Rule added (v6)

Перезапустите, чтобы конфигурация вступила в силу:

  1. sudo ufw reload

Результат будет выглядеть так:

Output
Firewall reloaded

Перейдите на домен код-серверной IDE.

запрос данных для входа в код-серверную IDE

Введите пароль код-серверной IDE. Вы увидите интерфейс, опубликованный на вашем домене.

графический интерфейс код-серверной IDE

Чтобы обеспечить его защиту, выполните установку TLS-сертификата Let’s Encrypt с помощью Certbot.

Запросите сертификат для вашего домена:

  1. sudo certbot --nginx -d code-server.your_domain

Предоставьте адрес электронной почты для срочных уведомлений, примите Правила и условия EFF и выберите, нужно ли перенаправить весь HTTP-трафик на HTTPS.

Результат будет выглядеть примерно следующим образом:

Output
IMPORTANT NOTES: - Congratulations! Your certificate and chain have been saved at: /etc/letsencrypt/live/code-server.your_domain/fullchain.pem Your key file has been saved at: /etc/letsencrypt/live/code-server.your_domain/privkey.pem Your cert will expire on ... To obtain a new or tweaked version of this certificate in the future, simply run certbot again with the "certonly" option. To non-interactively renew *all* of your certificates, run "certbot renew" ...

Certbot успешно сгенерировал TLS-сертификаты и применил их для конфигурации Nginx для вашего домена.

Заключение

Теперь у вас есть код-серверная IDE, установленная на сервере Ubuntu 18.04 и опубликованная на вашем домене с защитой в форме сертификатов Let’s Encrypt. Дополнительную информацию о других функциях и подробные инструкции по работе с прочими компонентами код-серверной IDE см. в документации для Visual Studio Code.


Want to learn more? Join the DigitalOcean Community!

Join our DigitalOcean community of over a million developers for free! Get help and share knowledge in our Questions & Answers section, find tutorials and tools that will help you grow as a developer and scale your project or business, and subscribe to topics of interest.

Sign up
About the authors
Default avatar
Savic

author

Developer and author at DigitalOcean.

Default avatar
Developer and author at DigitalOcean.

Still looking for an answer?

Was this helpful?
Leave a comment

This textbox defaults to using Markdown to format your answer.

You can type !ref in this text area to quickly search our full set of tutorials, documentation & marketplace offerings and insert the link!