Tutorial

Использование Visual Studio Code для удаленной разработки с помощью плагина Remote-SSH

Published on April 9, 2020
Русский
Использование Visual Studio Code для удаленной разработки с помощью плагина Remote-SSH

Введение

Visual Studio Code — популярная интегрированная среда разработки. Большой выбор плагинов, минимальный дизайн и поддержка кросс-платформ делают ее привлекательной для разработчиков всех уровней. В этом обучающем модуле основное внимание уделяется использованию плагина Remote-SSH для обеспечения удаленной разработки программного обеспечения. С этим плагином вы можете изменять файлы на локальной рабочей станции, при этом запуская такие задачи разработки, как выполнение программ, испытания узлов или статичный анализ на удаленном сервере.

Есть множество причин, по которым это может быть полезно для вас. Например, у вас может быть рабочая станция Windows, и вы хотите разрабатывать в Windows, но ваш код в конечном счете будет запускаться на Linux. Для обработки вам может потребоваться больше оперативной памяти или мощности процессора, чем у вашего текущего компьютера, или вы не захотите хранить код на личном компьютере из-за политики компании или желания оставить вашу рабочую станцию чистой.

В этом обучающем модуле вы научитесь активировать плагин Remote-SSH, настраивать Visual Studio Code для выполнения кода на удаленном сервере и выполнять код из локальной установки Visual Studio Code на удаленном сервере.

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

Для прохождения этого обучающего модуля вам потребуется следующее:

Шаг 1 — Установка плагина Remote-SSH

Extensions Marketplace — возможность загружать поддерживаемые и сторонние расширения для самых разных инструментов и языков программирования. Здесь вы найдете плагин Remote-SSH, после чего установите его.

С левой стороны IDE находится вертикальный ряд из пяти значков. Нижний значок, который выглядит как четыре квадрата в коробке с раскрывающимся правым верхним квадратом, — это значок Extensions Marketplace:

Расположение значка Extensions Marketplace

Также вы можете получить доступ к этому разделу, нажав Ctrl+Shift+X. После открытия этой страницы вы увидите предлагаемые плагины для загрузки и установки.

После открытия Extensions Marketplace введите Remote-SSH в панели Поиск расширений в Marketplace. Когда найдете плагин, выберите его и нажмите зеленую кнопку Установить для установки расширения.

Поиск плагина Remote SSH

Расширение установлено. Далее вы настроите расширение, чтобы подключиться к серверу.

Шаг 2 — Настройка плагина Remote-SSH и подключение к серверу

Теперь, когда у вас установлен плагин, вы можете настроить его для подключения к серверу. Для этого вам потребуются следующие сведения:

  • IP-адрес сервера или имя хоста.
  • Имя пользователя для подключения.
  • Закрытый ключ, который вы будете использовать для аутентификации пользователя.

Вы будете использовать эту информацию для создания файла конфигурации SSH, который Visual Studio Code может использовать для SSH для синхронизации файлов на сервере и выполнения кода от вашего имени. Вы создадите эту конфигурацию, используя Visual Studio Code.

Теперь, когда у вас установлен плагин Remote-SSH, вы увидите небольшую зеленую коробку в нижнем левом углу интерфейса Visual Studio Code. Если навести указатель мыши на это поле, появится всплывающее сообщение Открыть удаленное окно. Кнопка выглядит как математический знак «больше» чуть ниже знака «меньше» ><, как на следующем изображении:

Зеленая кнопка пользовательского интерфейса «Открыть удаленное окно»

Нажмите кнопку, и диалоговое окно отобразится наверху в центре. Выберите Remote-SSH: открыть файл конфигурации… из списка:

Выбор конфигурации SSH в пользовательском интерфейсе

Следующая подсказка спросит, какой файл конфигурации вы хотите открыть. Если вы используете Windows, то увидите два местоположения: одно в персональном каталоге пользователя и одно в месте установки SSH. Используйте файл в каталоге пользователя при настройке сервера.

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

config
Host my_remote_server
    HostName your_server_ip_or_hostname
    User sammy
    IdentityFile /location/of/your/private/key

Вот как работает этот файл конфигурации:

  • Host: указывает имя вашего хоста. Это позволяет использовать короткое имя или аббревиатуру вместо полного IP-адреса либо имя хоста при подключении к серверу.
  • HostName: фактическое имя хоста сервера, которое представляет собой либо IP-адрес, либо полностью квалифицированное доменное имя.
  • User: пользователь, от имени которого вы хотите выполнить подключение.
  • IdentityFile: путь к вашему закрытому ключу SSH. На системах Mac и Linux вы найдете ее в домашнем каталоге в скрытом каталоге .ssh, обычно id_rsa. Если вы используете Windows, у вас будет указано местоположение для сохранения этого файла при его создании с помощью putty-gen.

Определите соответствующие значения в вашем файле и сохраните файл.

Теперь Visual Studio Code настроен и готов подключиться к вашему серверу. Нажмите зеленую кнопку Открыть удаленное окно в нижнем левом углу и выберите Remote-SSH: подключиться к хосту…

Подключение к серверу из Visual Studio Code

После завершения всех этих действий все доступные и настроенные сервера появятся в выпадающем меню. Выберите из этого списка сервер, к которому вы хотите подключиться.

Если вы впервые подключились к этому серверу с компьютера, скорее всего, вы увидите диалог верификации SSH Fingerprint, как на следующем изображении:

Подтвердите ваш SSH Fingerprint («отпечаток пальца»)

Это необходимо, чтобы убедиться, что вы действительно подключаетесь к правильному серверу. Вы можете проверить это, войдя на свой сервер вручную и выполнив команду ssh-keygen -l -f /etc/ssh/ssh_host_key.pub для просмотра «отпечатка пальца» сервера. Если отпечаток тот же, что указан в Visual Studio Code, то вы действительно подключаетесь к правильному серверу, т.ч. можете нажать Продолжить.

Visual Studio Code по умолчанию открывает новое окно после создания нового подключения. Появится новое окно с экраном приветствия. Вы узнаете, что подключение прошло успешно, если увидите SSH: your_ip_address_or_hostname в зеленой коробке в нижнем левом углу. Это означает, что Visual Studio Code подключен и связывается с вашим удаленным сервером.

Успешное подключение SSH

Теперь, когда вы подключены, вы можете выполнять команды и код из редактора.

Шаг 3 — Выполнение кода на удаленном сервере

Плагин Remote-SSH настроен, и теперь можно запустить какой-нибудь код на вашем удаленном компьютере. Откройте окно терминала, выбрав Терминал из панели навигации в верхней части окна Visual Studio, и нажмите Новый терминал. Также вы можете открыть терминал, нажав ``CTRL+Shift+​​```. Открывшийся терминал находится на вашем удаленном сервере, а не на локальном компьютере.

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

  1. ip addr

В своем терминале вы увидите следующее:

Output
1: lo: <LOOPBACK,UP,LOWER_UP> mtu 65536 qdisc noqueue state UNKNOWN group default qlen 1000 link/loopback 00:00:00:00:00:00 brd 00:00:00:00:00:00 inet 127.0.0.1/8 scope host lo valid_lft forever preferred_lft forever inet6 ::1/128 scope host valid_lft forever preferred_lft forever 2: eth0: <BROADCAST,MULTICAST,UP,LOWER_UP> mtu 1500 qdisc fq_codel state UP group default qlen 1000 link/ether 16:cb:05:5b:30:f1 brd ff:ff:ff:ff:ff:ff inet your_server_ip brd your_broadcast_address scope global eth0 valid_lft forever preferred_lft forever ...

Чтобы протестировать способность запуска удаленного кода, создайте новый файл Python с именем hello.py в редакторе. После подключения к удаленному серверу все файлы, созданные при помощи Visual Studio Code, будут сохранены на этот сервер, а не на локальный компьютер.

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

hello.py
print("Hello Sammy!")

Для запуска этой программы на вашем сервере откройте терминал в Visual Studio Code из меню навигации, или нажав CTRL+Shift+` . Поскольку этот терминал подключен к вашему удаленному серверу, выполните в терминале следующую команду для выполнения вашей программы hello.py:

  1. python3 hello.py

Отобразится вывод вашей программы.

Выполнение вашего скрипта Python

Также вы можете выполнить файл из контекстного меню Отладка​​, выбрав Запуск без отладки.

Примечание: Если у вас есть какие-либо расширения разработки, установленные в Visual Studio Code, такие как расширение Python, то вам придется повторно установить эти расширения на вашем сервере при помощи Extension Marketplace. Если вы ранее установили эти плагины в Visual Studio Code, то когда вы снова будете искать их, Marketplace укажет Установить на SSH: hostname. Всегда обращайте внимание, в каком контексте разработки вы находитесь, поскольку в этом месте Visual Studio Code установит ваши плагины и создаст ваши файлы. Если вы попробуете запустить ваш код без установки этих плагинов, то в правом нижнем углу экрана будут появляться диалоговые окна сообщений об ошибках, предлагающие установить их на удаленном сервере. После их установки они, скорее всего, потребуют от вас перезагрузки Visual Studio Code. После перезагрузки он будет продолжать работать на удаленном сервере без необходимости повторно подключаться вручную.

Заключение

Теперь у вас есть Visual Studio Code, настроенный для разработки на удаленном сервере с помощью SSH. Удаленное исполнение при помощи IDE обеспечивает множество преимуществ, в том числе способность быстро тестировать процесс выполнения вашего кода на различных операционных системах и с различными техническими спецификациями оборудования. Если у вас есть подключение к Интернету, вы можете подключаться к вашему серверу и работать над вашим кодом с любого компьютера, а также можете заниматься разработкой в среде Linux, даже если будете использовать Windows в качестве основной операционной системы.

Thanks for learning with the DigitalOcean Community. Check out our offerings for compute, storage, networking, and managed databases.

Learn more about our products

About the authors
Default avatar

Developer Advocate

Mason is currently a Sr. Developer Advocate at DigitalOcean who specializes in cloud infrastructure, distributed systems, and Python.



Still looking for an answer?

Ask a questionSearch for more help

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!

Try DigitalOcean for free

Click below to sign up and get $200 of credit to try our products over 60 days!

Sign up

Join the Tech Talk
Success! Thank you! Please check your email for further details.

Please complete your information!

Featured on Community

Get our biweekly newsletter

Sign up for Infrastructure as a Newsletter.

Hollie's Hub for Good

Working on improving health and education, reducing inequality, and spurring economic growth? We'd like to help.

Become a contributor

Get paid to write technical tutorials and select a tech-focused charity to receive a matching donation.

Welcome to the developer cloud

DigitalOcean makes it simple to launch in the cloud and scale up as you grow — whether you're running one virtual machine or ten thousand.

Learn more
DigitalOcean Cloud Control Panel