Zarządzaj hostingiem za pomocą Visual Studio Code przez SFTP

Wprowadzenie

Jeśli posiadasz hosting od OVHcloud, zyskasz dostęp do przestrzeni dyskowej umożliwiającej zarządzanie stroną WWW. Dostęp do przestrzeni dyskowej jest możliwy poprzez protokół SFTP. Chociaż możliwe jest połączenie za pomocą terminala, możesz również użyć zintegrowanego środowiska programistycznego (IDE) Visual Studio Code do zarządzania folderami i plikami strony WWW.

Dowiedz się, jak zarządzać stroną WWW przy użyciu Visual Studio Code.

Wymagania początkowe

• Posiadanie hostingu OVHcloud
• Zainstaluj Microsoft Visual Studio Code na komputerze

Dostęp do Panelu klienta OVHcloud

• Link bezpośredni: Hosting
• Ścieżka nawigacji: Web Cloud > Hosting > Wybierz hosting WWW

W praktyce

Zainstaluj rozszerzenie SFTP dla Visual Studio Code

Po uruchomieniu Visual Studio Code przejdź do poziomego menu na górze interfejsu, kliknij View, a następnie Extensions.

Aby wykonać tę samą akcję ze skrótem klawiaturowym, wybierz:

• Ctrl + Shift + X jeśli korzystasz z systemu Windows,
• Maj + Command + X jeśli korzystasz z systemu macOS.

W lewym górnym rogu wpisz nazwę rozszerzenia "SFTP/FTP sync" Natizyskunk i kliknij na Install.

Można również zainstalować rozszerzenie "SFTP/FTP sync" z marketplace Visual Studio.

Inicjuj projekt lokalnie

Aby zsynchronizować pliki strony WWW z hostingiem za pomocą Visual Studio Code, podaj lokalizację projektu lokalnie. W tym celu utwórz folder w żądanym miejscu.

Wróć do programu Visual Studio Code w menu poziomym u góry interfejsu, kliknij przycisk View, a następnie wybierz polecenie Command Palette, aby wyświetlić edytor poleceń.

Aby wykonać tę samą akcję ze skrótem klawiaturowym, wybierz:

• Ctrl + Shift + P jeśli korzystasz z systemu Windows,
• Maj + Command + P jeśli korzystasz z systemu macOS.

Wprowadź następującą komendę: SFTP: Config.

Dzięki temu poleceniu program Visual Studio Code utworzy plik konfiguracyjny "sftp.json" w katalogu głównym utworzonego wcześniej folderu lokalnego. Ponieważ jednak Visual Studio Code nie zna jeszcze lokalizacji Twojego projektu lokalnie, powinien pojawić się następujący komunikat:

Kliknij Open Folder, przejdź do wybranego katalogu lokalnego i kliknij Wybierz folder, aby potwierdzić.

W Visual Studio Code wprowadź ponownie komendę SFTP: Config. Plik konfiguracyjny o nazwie "sftp.json" pojawi się w kodzie Visual Studio Code.

Plik ten znajduje się w folderze .vscode, który jest umieszczony w katalogu głównym projektu lokalnego.

Konfiguracja pliku sftp.json

Zanim rozpoczniesz pracę nad Twoim projektem, przekaż go do utworzonego wcześniej lokalnego folderu. Najpierw jednak upewnij się, że plik "sftp.json" jest poprawnie skonfigurowany. Zapoznaj się z naszym przewodnikiem "Logowanie do przestrzeni dyskowej FTP hostingu", aby znaleźć potrzebne informacje.

W pliku "sftp.json" wprowadź wartości dla następujących wpisów:

name

Kliknij poniższe karty, aby wyświetlić kolejne 2 kroki.

host

Kliknij poniższe karty, aby wyświetlić kolejne 2 kroki.

username

Kliknij poniższe karty, aby wyświetlić kolejne 2 kroki.

remotePath

Kliknij poniższe karty, aby wyświetlić kolejne 2 kroki.

Dodaj ten wiersz do pliku "sftp.json": "openSsh": true

Przykładowy plik "sftp.json":

{
    "name": "<name>",
    "host": "<host>",
    "protocol": "sftp",
    "port": 22,
    "username": "myusername",
    "password": "mypassword",
    "remotePath": "/home/myusername",
    "uploadOnSave": false,
    "useTempFile": false,
    "openSsh": true
}

Więcej informacji na temat opcji w pliku "sftp.json" można znaleźć w dokumentacji projektu.

Pobierz projekt lokalnie

Po skonfigurowaniu pliku "sftp.json" pobierz zawartość Twojego projektu, aby pobrać wszystkie foldery i pliki Twojej strony WWW. W tym celu przejdź do Visual Studio Code i wprowadź następującą komendę: SFTP: Download Project.

Program Visual Studio Code wymaga wybrania folderu, który chcesz pobrać na hosting WWW. Wpisz poprzednio zdefiniowaną wartość name w pliku "sftp.json".

Jeśli zostanie wyświetlony monit, wprowadź hasło powiązane z danym użytkownikiem w pliku "sftp.json", a następnie kliknij enter. Po pobraniu pliku wszystkie foldery i pliki projektu będą wyświetlane w Eksploratorze plików znajdującym się w kolumnie po lewej stronie interfejsu Visual Studio Code.

Wprowadzanie zmian w plikach

Po pobraniu projektu lokalnie na komputer można łatwo edytować, dodawać lub usuwać pliki w Visual Studio Code.

Jeśli chcesz, aby zmiany lokalne były synchronizowane przy każdej kopii zapasowej pliku, dodaj ten wiersz do pliku "sftp.json":"uploadOnSave": true

Aby wyłączyć tę funkcję, pozostawiając ją w pliku "sftp.json", zmień wartość true na false.

Do tej pory wspomnieliśmy tylko polecenia: SFTP: Config i SFTP: Download Project. Istnieją inne polecenia, które możesz obejrzeć przez autouzupełnianie, wprowadzając SFTP: w edytorze poleceń.

Listę poleceń tutaj.

Możesz teraz uzyskiwać dostęp do zawartości hostingu i modyfikować ją za pomocą kodu Visual Studio Code. Celem tego przewodnika jest przedstawienie w sposób efektywny sposobu zarządzania projektem w Visual Studio Code. Odpowiedni do pierwszego eksperymentu. Jeśli jednak zmodyfikujesz kilka plików i są one synchronizowane na Twoim hostingu, nie będziesz mógł sprawdzić historii zmian, aby w razie potrzeby wrócić do nich lub nadrobić błąd.

Sprawdź również

Logowanie do przestrzeni dyskowej FTP hostingu WWW

Korzystanie z FileZilla na Twoim hostingu OVHcloud

Korzystanie z dostępu do hostingu WWW przez SSH. Pamiętaj, że aby korzystać z SSH, musisz mieć wykupiony hosting Pro lub Performance.

W przypadku wyspecjalizowanych usług (pozycjonowanie, rozwój, etc.) skontaktuj się z partnerami OVHcloud.

Jeśli chcesz otrzymywać wsparcie w zakresie konfiguracji i użytkowania Twoich rozwiązań OVHcloud, zapoznaj się z naszymi ofertami pomocy.

Dołącz do grona naszych użytkowników.