Naar hoofdinhoud springen

Verbinding maken met sitebestanden via VSCode

Om verbinding te maken via SSH en FTP/SFTP, gebruikt Visual Studio Code een extensie die handige toegang biedt tot externe bestanden.

SSH​

De extensie installeren​

Open Visual Studio Code. Klik op het pictogram "Extensions" in de zijbalk (vierkant pictogram), zoek in de Extensions-weergave naar SSH.
Klik op "Install" bij de extensie met de naam "Remote - SSH" van Microsoft.

Installeer extensie

SSH-sleutels instellen​

Om zonder wachtwoord verbinding te maken via SSH, stel je je SSH-sleutel in FASTPANEL in met behulp van dit artikel.

opmerking

Je kunt de sitegebruiker vinden in de sitekaart, in het veld "Site user". Om het wachtwoord van de sitegebruiker te wijzigen, ga je naar de sectie "Management" → "Users" in FASTPANEL®.

SSH configureren in VSCode​

Druk op F1 in Windows/Linux of Cmd+Shift+P op Mac om het opdrachtpalet te openen, typ en selecteer Remote-SSH: Add New SSH Host, en voer vervolgens de SSH-verbindingsreeks in in het formaat:

ssh site_user@11.22.33.44

Voeg nieuwe SSH-host toe

Vervang site_user en 11.22.33.44 door de juiste waarden. In plaats van site_user moet je de sitegebruiker opgeven, en in plaats van 11.22.33.44 het IP-adres van je server. Na het invoeren van de opdracht kies je het configuratiebestand om de SSH-configuratie op te slaan (meestal ~/.ssh/config).

Verbinding maken met de externe server​

Druk op F1 in Windows/Linux of Cmd+Shift+P op Mac om het opdrachtpalet te openen, typ en selecteer Remote-SSH: Connect to Host, kies de eerder toegevoegde host, accepteer de vingerafdruk van de server en voer de wachtwoordzin voor je SSH-sleutel in als dit de eerste keer is dat je verbinding maakt, en voer, indien gevraagd, je wachtwoord in.

Nadat je verbinding hebt gemaakt, ga je naar "Explorer" → "Open Folder" om een map op de host te openen.
Bijvoorbeeld /var/www/site_user/data/www/example.com.

Verbinding maken met de externe server

Bestanden openen en beginnen met coderen​

Zodra er verbinding is gemaakt, wordt VSCode opnieuw geladen en kun je bestanden op de externe server rechtstreeks in VSCode bekijken. Je kunt bestanden openen, bewerken en opslaan net zoals op je lokale machine.

Zie voor meer informatie de documentatie van de extensie.

FTP/SFTP​

De extensie installeren​

Open Visual Studio Code. Klik op het pictogram "Extensions" in de zijbalk (vierkant pictogram). Typ SFTP in de zoekbalk. Klik op "Install" om de geselecteerde extensie te installeren.

Installeer extensie

De verbinding configureren​

Open het opdrachtpalet door op F1 te drukken in Windows/Linux of Cmd+Shift+P op Mac, typ SFTP: Config en bewerk vervolgens de configuratieparameters met de gegevens van je externe server in het bestand sftp.json onder de map .vscode. Bijvoorbeeld:

{  
    "name": "My Server",  
    "host": "11.22.33.44",  
    "protocol": "ftp",  
    "password": "password",  
    "port": 21,  
    "username": "ftp_user",  
    "remotePath": "/",  
    "uploadOnSave": false,  
    "useTempFile": false,  
    "openSsh": false  
}
opmerking

Je kunt in dit artikel lezen hoe je FTP-accounts aanmaakt in FASTPANEL® en in dit artikel hoe je SFTP-accounts aanmaakt.

  • "host": IP-adres van je server.
  • "protocol": Geef ftp of sftp op.
  • "port": 21 voor FTP of 2222 voor SFTP.
  • "username" en "password": Inlognaam en wachtwoord voor het FTP/SFTP-account.
  • "remotePath": Geef de map op de server op waarmee je wilt werken.
  • "uploadOnSave": Optie voor automatisch uploaden bij het opslaan van het bestand.

De wachtwoordparameter in sftp.json is optioneel; als je die weglaat, wordt je tijdens het synchroniseren om een wachtwoord gevraagd. Sla het sftp.json bestand op en sluit het.

Werken met bestanden​

Open het opdrachtpalet, druk op F1 in Windows/Linux of Cmd+Shift+P op Mac. Typ vervolgens SFTP om een aantal beschikbare opdrachten te zien, die je ook kunt openen vanuit de contextmenu's van de bestandsverkenner van het project.
Om te synchroniseren met een externe map, gebruik je de opdracht SFTP: Download Project, die de map die is opgegeven in de instelling remotePath in sftp.json downloadt naar je lokaal geopende map.

Remote Explorer​

Met Remote Explorer kun je externe bestanden bekijken. Je kunt Remote Explorer openen door de opdracht View: Show SFTP uit te voeren. Klik daarna op de SFTP-weergave in de activiteitenbalk.

Met Remote Explorer kun je alleen de inhoud van een bestand bekijken. Gebruik SFTP: Edit in Local om het lokaal te bewerken.

Installeer extensie