Cách sử dụng Visual Studio Code để phát triển từ xa thông qua Plugin Remote-SSH

Giới thiệu

Visual Studio Code là một Môi trường phát triển tích hợp (IDE) phổ biến dành cho các nhà phát triển. Với nhiều lựa chọn plugin, thiết kế tối giản và hỗ trợ đa nền tảng khiến nó trở thành lựa chọn tuyệt vời cho các nhà phát triển ở mọi cấp độ.

Hướng dẫn này tập trung vào việc sử dụng plugin Remote-SSH để cho phép phát triển phần mềm từ xa. Với plugin này, bạn có thể chỉnh sửa các tệp trên máy trạm cục bộ của mình (Localhost) nhưng chạy các tác vụ phát triển như thực thi chương trình, kiểm tra đơn vị hoặc phân tích tĩnh trên máy chủ từ xa (Server).

Có nhiều lý do tại sao điều này có thể có lợi cho bạn. Ví dụ: bạn có thể có một máy trạm Windows và muốn phát triển trên Windows, nhưng mã của bạn cuối cùng sẽ chạy trên Linux.

Điều kiện tiên quyết

Để làm theo hướng dẫn này, bạn sẽ cần:

  1. Máy phát triển cục bộ chạy Windows, MacOSX hoặc Linux. Hướng dẫn này sẽ không hoạt động trên các thiết bị ChromeOS.
  2. Visual Studio Code, bạn có thể tải xuống và cài đặt từ trang web chính thức.
  3. Một cặp khóa SSH được tạo:
    • Nếu bạn đang sử dụng macOS hoặc Linux, bạn có thể làm theo Bước 1 từ Cách thiết lập khóa SSH trên Ubuntu 20.04. Các lệnh đều giống nhau, vì vậy đừng lo lắng rằng hướng dẫn nói rằng nó dành cho Ubuntu 18.04.
    • Nếu bạn đang sử dụng Windows, hãy làm theo hướng dẫn Cách tạo Khóa SSH bằng PuTTY trên Windows để tạo Khóa SSH của bạn.
    • Nếu bạn đang sử dụng DigitalOcean, bạn có thể làm theo hướng dẫn Cách tải khóa công khai SSH lên tài khoản DigitalOcean.
  4. Một máy chủ Ubuntu 18.04 được thiết lập bằng cách làm theo hướng dẫn thiết lập máy chủ ban đầu của Ubuntu 18.04, bao gồm người dùng hỗ trợ sudo không root và tường lửa.

Bước 1 — Cài đặt Remote-SSH Plugin

Bạn có thể tải tại Marketplace của Microsoft với những tiện ích mở rộng, là nơi bạn có thể tải xuống các tiện ích hỗ trợ, cho nhiều công cụ và ngôn ngữ lập trình khác nhau. Đây là nơi bạn sẽ tìm kiếm plugin Remote-SSH và cài đặt nó.

Ở phía bên trái của IDE có một hàng dọc gồm năm biểu tượng. Biểu tượng dưới cùng, trông giống như bốn ô vuông trong một hộp với ô vuông trên cùng bên phải nổ tung, là biểu tượng của Thị trường tiện ích mở rộng:

Bạn cũng có thể truy cập phần này bằng cách nhấn Ctrl+Shift+X. Khi bạn mở trang này, bạn sẽ thấy các plugin được đề xuất để tải xuống và cài đặt.

Khi bạn đã mở Extensions Marketplace, hãy nhập Remote-SSH vào thanh tìm kiếm. Khi bạn tìm thấy plugin, hãy chọn nó rồi nhấp vào nút Cài đặt màu xanh lục để cài đặt tiện ích mở rộng.

Tiện ích mở rộng hiện đã được cài đặt. Tiếp theo, bạn sẽ định cấu hình tiện ích mở rộng để có thể kết nối với máy chủ của mình.

Bước 2 — Cài đặt cấu hình trình cắm SSH từ xa và kết nối với máy chủ

Bây giờ bạn đã cài đặt plugin, bạn có thể định cấu hình nó để kết nối với máy chủ. Để làm như vậy, bạn sẽ cần những thông tin sau:

  • IP hoặc tên máy chủ.
  • Tên người dùng (username) mà bạn sẽ kết nối.
  • Khóa riêng (private key) mà bạn sẽ sử dụng để xác thực người dùng của mình.
  • Bạn sẽ sử dụng thông tin này để tạo tệp cấu hình SSH mà Visual Studio Code có thể sử dụng để SSH tới máy chủ nhằm đồng bộ hóa tệp và thực thi mã thay cho bạn.

Plugin Remote-SSH, bạn sẽ thấy một hộp nhỏ màu xanh lục ở góc dưới cùng bên trái của giao diện Visual Studio Code. Nếu bạn di chuột qua hộp bằng con trỏ chuột, cửa sổ bật lên sẽ cho biết Mở một cửa sổ từ xa (Open a remote window). Nút trông giống như một dấu lớn hơn một chút bên dưới một dấu nhỏ hơn ><, giống như trong hình ảnh sau:

Nhấp vào nút và một hộp thoại xuất hiện ở trung tâm trên cùng. Chọn Remote-SSH: Open Configuration File… từ danh sách:

Dấu nhắc tiếp theo sẽ hỏi bạn muốn mở tệp cấu hình nào. Nếu đang dùng Windows, bạn sẽ thấy hai vị trí: một trong thư mục người dùng cá nhân của bạn và một trong vị trí cài đặt SSH. Bạn nên sử dụng tệp trong thư mục người dùng của mình khi định cấu hình máy chủ.

Chọn tệp và trình chỉnh sửa của bạn sẽ mở tệp cấu hình (CONFIG). Thêm mã sau vào tệp để xác định kết nối với máy chủ của bạn, thay thế các phần được đánh dấu bằng thông tin cho máy chủ của bạn:

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

Đây là cách tệp cấu hình hoạt động:

  • Máy chủ: Điều này chỉ định tên cho máy chủ của bạn. Điều này cho phép bạn sử dụng tên ngắn hoặc tên viết tắt thay vì địa chỉ IP đầy đủ hoặc tên máy chủ khi kết nối với máy chủ.
  • Tên máy chủ: Tên máy chủ thực tế của máy chủ, là địa chỉ IP hoặc tên miền đủ điều kiện.
  • Người dùng: Người dùng bạn muốn sử dụng để kết nối.
  • IdentityFile: Đường dẫn đến khóa riêng SSH của bạn. Trên các hệ thống Mac và Linux, bạn sẽ tìm thấy tệp này trong thư mục chính của mình trong một thư mục .ssh ẩn, thường được gọi là id_rsa. Nếu bạn đang sử dụng Windows, bạn sẽ chỉ định một vị trí để lưu tệp này khi bạn tạo tệp bằng putty-gen.

Chỉ định các giá trị thích hợp trong tệp của bạn và lưu tệp.

Visual Studio Code hiện đã được định cấu hình và sẵn sàng kết nối với máy chủ của bạn. Nhấp vào nút màu xanh lục Mở cửa sổ từ xa (open a remote window) ở góc dưới cùng bên trái và chọn Remote-SSH: Connect to Host…

Khi bạn đã hoàn thành việc này, tất cả các máy chủ khả dụng và được định cấu hình sẽ xuất hiện trong menu thả xuống. Chọn máy chủ mà bạn muốn kết nối từ danh sách này.

Nếu đây là lần đầu tiên bạn kết nối với máy chủ này từ máy của mình, bạn có thể sẽ được nhắc với hộp thoại xác minh Dấu vân tay SSH, giống như hộp thoại trong hình ảnh sau:

Điều này nhằm đảm bảo rằng bạn đang thực sự kết nối với máy chủ mà bạn nghĩ là đang kết nối. Bạn có thể xác minh điều này bằng cách đăng nhập thủ công vào máy chủ của mình và chạy ssh-keygen -l -f /etc/ssh/ssh_host_key.pub để xem dấu vân tay của máy chủ. Nếu dấu vân tay này giống với dấu vân tay được hiển thị cho bạn trong Visual Studio Code, thì bạn thực sự đang kết nối với máy chủ mà bạn nghĩ là bạn, vì vậy bạn có thể nhấp vào Tiếp tục.

Visual Studio Code mặc định mở một cửa sổ mới khi kết nối mới được thực hiện. Một cửa sổ mới sẽ xuất hiện với màn hình chào mừng. Bạn sẽ biết rằng kết nối của mình đã thành công nếu thấy SSH: your_ip_address_or_hostname trong hộp màu xanh lục ở góc dưới cùng bên trái. Điều này có nghĩa là Visual Studio Code được kết nối và giao tiếp với máy chủ từ xa của bạn.

Bây giờ bạn đã kết nối, bạn có thể chạy các lệnh và mã từ trình chỉnh sửa của mình.

Bước 3 — Thực thi Mã trên Máy chủ Từ xa

Plugin Remote-SSH đã được định cấu hình và đã đến lúc chạy một số mã trên máy từ xa của bạn. Mở cửa sổ terminal bằng cách chọn Terminal từ thanh điều hướng ở đầu cửa sổ Visual Studio và nhấp vào New Terminal. Bạn cũng có thể mở một thiết bị đầu cuối bằng cách nhấn CTRL+Shift+`. Thiết bị đầu cuối được mở là thiết bị đầu cuối trên máy chủ từ xa của bạn, không phải thiết bị đầu cuối trên máy cục bộ của bạn.

Khi thiết bị đầu cuối mở ra, hãy đưa ra lệnh sau để xem địa chỉ IP của máy chủ của bạn nhằm xác minh rằng bạn đã kết nối với máy chủ từ xa của mình:

ip addr

Bạn sẽ thấy đầu ra sau trong thiết bị đầu cuối của mình:

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
    ...

Để kiểm tra khả năng chạy mã từ xa, hãy tạo một tệp Python mới có tên hello.py trong trình chỉnh sửa của bạn. Khi bạn được kết nối với máy chủ từ xa, tất cả các tệp được tạo thông qua Visual Studio Code sẽ được lưu vào máy chủ đó, không phải trên máy cục bộ của bạn.

Thêm các nội dung sau vào tệp:

print("Hello Sammy!")

Để chạy file này trên máy chủ của bạn, hãy mở một thiết bị đầu cuối trong Visual Studio Code từ menu điều hướng hoặc bằng cách nhấn dãy phím CTRL+Shift+`. Vì phiên đầu cuối này được kết nối với máy chủ từ xa của bạn, hãy chạy lệnh sau trong thiết bị đầu cuối để thực thi chương trình hello.py của bạn:

python3 hello.py

Đầu ra của chương trình của bạn sẽ được hiển thị.

Bạn cũng có thể thực thi tệp từ trình đơn ngữ cảnh Gỡ lỗi (Debug) bằng cách chọn Chạy mà không cần gỡ lỗi (Run without Debugging.)

Lưu ý:

Nếu bạn đã cài đặt bất kỳ tiện ích mở rộng phát triển nào trong Visual Studio Code, chẳng hạn như tiện ích mở rộng Python, thì bạn sẽ phải cài đặt lại các tiện ích mở rộng này trên máy chủ của mình thông qua Thị trường tiện ích mở rộng. Nếu trước đây bạn đã cài đặt các plugin này trong Visual Studio Code, khi bạn tìm kiếm lại chúng, Thị trường sẽ cho biết Cài đặt trên SSH: tên máy chủ. Luôn chú ý đến bối cảnh phát triển của bạn, bởi vì đây là nơi mà Visual Studio Code sẽ cài đặt các plugin và tạo các tệp của bạn. Nếu bạn cố chạy mã của mình mà không cài đặt các plugin này, các hộp thoại lỗi sẽ xuất hiện ở góc dưới cùng bên phải của màn hình nhắc bạn cài đặt chúng trên máy chủ từ xa. Sau khi bạn đã cài đặt, chúng có thể sẽ yêu cầu bạn tải lại Visual Studio Code. Khi bạn khởi chạy lại, nó sẽ tiếp tục hoạt động trên máy chủ từ xa mà bạn không cần phải kết nối lại theo cách thủ công.

Phần kết luận

Bây giờ bạn đã cấu hình Visual Studio Code để phát triển trên máy chủ từ xa bằng SSH. Thực thi từ xa với IDE mang lại nhiều lợi ích, bao gồm khả năng kiểm tra nhanh cách mã của bạn chạy trên các hệ điều hành khác nhau và các thông số kỹ thuật phần cứng khác nhau. Miễn là bạn có kết nối internet, bạn có thể kết nối với máy chủ của mình và làm việc với mã của mình từ bất kỳ máy tính nào và bạn sẽ có thể phát triển bằng môi trường Linux ngay cả khi bạn chạy Windows làm hệ điều hành chính.
Đã đăng trong Linux, VPS, Hosting và được gắn thẻ , , .