Как установить облачную IDE Visual Studio Code на сервер Ubuntu 24.04

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

Этот гид покажет вам, как установить Visual Code-Server на сервер Ubuntu 24.04 с Nginx в качестве обратного прокси.

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

Перед тем как начать, убедитесь, что у вас есть следующее:

Сервер Ubuntu 24.05.
Непривилегированный пользователь с правами администратора.
Доменное имя, указывающее на IP-адрес сервера.

Установка code-server с помощью скрипта установки

Чтобы установить code-server, вы можете скачать и запустить скрипт установки code-server. В этом примере вы будете устанавливать code-server как непривилегированный пользователь. Убедитесь, что вы вошли в свою учетную запись.

Сначала выполните команду ниже, чтобы убедиться, что code-server может быть установлен на вашей системе.

curl -fsSL https://code-server.dev/install.sh | sh -s -- --dry-run

Когда code-server будет установлен на вашей системе, вы увидите следующий вывод:

тестовая установка

Теперь установите code-server с помощью команды ниже. Введите свой пароль sudo/администратора, когда будет предложено.

curl -fsSL https://code-server.dev/install.sh | sh

установка code-server

После завершения установки запустите и активируйте code-server с помощью следующей команды ‘ systemctl ‘.

sudo systemctl enable --now code-server@$USER

Наконец, проверьте службу code-server с помощью следующей команды, чтобы убедиться, что служба работает.

sudo systemctl status code-server@$USER

В этом выводе вы можете увидеть, что code-server работает, который работает на порту по умолчанию 8080.

запуск и проверка code-server

Настройка пароля code-server

После установки code-server вы настроите аутентификацию по паролю для защиты среды code-server.

Откройте файл конфигурации code-server по умолчанию ~/.config/code-server/config.yaml с помощью редактора ‘ nano ‘.

nano ~/.config/code-server/config.yaml

Измените пароль по умолчанию на ваш безопасный пароль.

bind-addr: 127.0.0.1:8080  
auth: password  
password: 0e0cb3af923c659366334664  
cert: false

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

Теперь выполните команду ниже, чтобы перезапустить code-server и применить ваши изменения.

sudo systemctl restart code-server@$USER

Настройка Nginx в качестве обратного прокси

Теперь, когда вы защитили code-server, вы установите Nginx и настроите его в качестве обратного прокси. Убедитесь, что ваше доменное имя указывает на IP-адрес сервера.

Установите веб-сервер Nginx с помощью следующей команды ‘ apt ‘. Введите ‘ Y ‘, чтобы подтвердить установку.

sudo apt install nginx -y

установка nginx

После завершения установки создайте новую конфигурацию блока сервера ‘ /etc/nginx/sites-available/code-server.conf ‘ с помощью редактора ‘ nano ‘.

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

Вставьте следующую конфигурацию в файл и убедитесь, что вы изменили доменное имя ‘ code.howtoforge.local ‘.

server {  
listen 80;  
listen [::]:80;  
server_name code.howtoforge.local;  
  
location / {  
proxy_pass http://localhost:8080/;  
proxy_set_header Host $http_host;  
proxy_set_header Upgrade $http_upgrade;  
proxy_set_header Connection upgrade;  
proxy_set_header Accept-Encoding gzip;  
}  
}

Когда закончите, сохраните файл и выйдите из редактора.

Далее выполните следующую команду, чтобы активировать блок сервера ‘ code-server.conf ‘ и проверить вашу конфигурацию Nginx.

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

Если вы все сделали правильно и у вас правильная конфигурация Nginx, вы увидите вывод ‘ синтаксис в порядке - тест успешен’.

проверка nginx

Теперь выполните команду ниже, чтобы перезапустить веб-сервер Nginx и применить изменения. Затем проверьте статус Nginx, чтобы убедиться, что веб-сервер работает.

sudo systemctl restart nginx  
sudo systemctl status nginx

В следующем выводе вы можете увидеть, что веб-сервер Nginx работает в качестве обратного прокси для приложения code-server.

проверка nginx

Настройка UFW (Простой брандмауэр)

Чтобы разрешить доступ к code-server, вам необходимо открыть порты HTTP и HTTPS через UFW (Простой брандмауэр).

Выполните команду ниже, чтобы активировать профиль ‘ Nginx Full ‘ и разрешить HTTP и HTTPS трафик для вашей установки Nginx. После добавления вы увидите вывод ‘Правило добавлено’.

sudo ufw allow 'Nginx Full'

Теперь выполните следующую команду, чтобы проверить статус UFW. Убедитесь, что профиль ‘Nginx Full’ включен, чтобы разрешить доступ отовсюду.

sudo ufw status

Защита code-server с помощью HTTPS

В этом разделе вы защитите code-server с помощью HTTPS, сгенерировав SSL/TLS сертификаты через certbot и letsencrypt.

Установите пакеты ‘certbot’ и ‘python3-certbot-nginx’ с помощью следующей команды ‘apt’.

sudo apt install certbot python3-certbot-nginx

После завершения установки выполните команду ‘certbot’ ниже, чтобы сгенерировать SSL/TLS сертификаты и защитить вашу установку code-server. Убедитесь, что вы изменили доменное имя и адрес электронной почты на свои данные.

sudo certbot --nginx --agree-tos --redirect --hsts --staple-ocsp --email [email protected] -d code.howtoforge.local

Когда процесс завершится, ваша установка code-server будет автоматически защищена с помощью HTTPS. А ваши SSL/TLS сертификаты будут доступны в каталоге ‘/etc/letsencrypt/live/code.howtoforge.local’.

Доступ к code-server

Откройте веб-браузер и перейдите по адресу https://code.howtoforge.local. Если ваша установка успешна, вам будет предложено ввести пароль для аутентификации.

Введите свой пароль и нажмите ОТПРАВИТЬ, чтобы подтвердить.

вход в код-сервер

Если у вас правильный пароль, вы увидите следующий экран code-server. Выберите свою тему по умолчанию, светлую или темную.

изменение темы

Теперь вы получите следующий живой code-server в вашем веб-браузере.

код-сервер

Заключение

Поздравляем! Вы завершили установку сервера VS code на сервере Ubuntu 24.04. Вы установили и защитили сервер кода с аутентификацией по паролю и HTTPS и настроили Nginx в качестве обратного прокси для вашей установки сервера кода.