VSCode에서 SSH를 사용한 서버 접속 후 원격개발

 

안녕하세요. 달소입니다.

오랜만에 SW 갤러리에 이렇게 글을...ㅎㅎ

사실 저는 서버에 접근해서 파일관리하는데 putty를 사용한 ssh 접근 및 vim 편집기 / winscp를 이용한파일업로드를 주로 이용했습니다.

이렇게 작업을 많이했었는데.. 대장님께 css 관련문의나 질문을하면 VScode 놔두고 왜 그것만 쓰냐고.. 혼나기도 했지요..

그래서 이번에 날잡고 VScode 설치 및 서버 연동까지 진행했습니다.
이 VScode를 통해 로컬의 WSL이나 원격의 SSH, 도커 Container등 접속해서 파일 수정 업/다운로드, 터미널을 통한 명ㄹ여어사용등 모든게 가능합니다.

VScode에서 원격접속을 하는방법

Visual Studio Code Remote - SSH 확장을 사용하면 실행 중인 SSH 서버가 있는 원격 컴퓨터, 가상 컴퓨터 또는 컨테이너에서 원격 폴더를 열고 VS Code의 기능 집합을 최대한 활용할 수 있습니다. 서버에 연결되면 원격 파일 시스템의 어디에서나 파일 및 폴더와 상호 작용할 수 있습니다.

확장이 원격 시스템에서 직접 명령 및 기타 확장을 실행하기 때문에 이러한 이점을 얻기 위해 로컬 시스템에 소스 코드가 없어도 됩니다.

참고 : https://code.visualstudio.com/docs/remote/ssh

 

VS Code 확장 툴 설치하기

vscode를 설치는 https://code.visualstudio.com/download 에서 진행해주시면 되고

 

설치 후 좌측에 마켓플레이스에서 Remote Development를 검색해서 설치해주시면 됩니다.

 

그리고 좌측 맨하단의 Remote 탐색기를 눌러서 SSH Targets로 변경 후 Add New를 눌러주세요.

 

 

위창이 뜨면 ssh [계정명]@IP 로 접속해줍니다.

 

 

플랫폼은 당연히 리눅스

 

 

PW를 누르면 이렇게 원격으로 연결이됩니다.

 

 

원격 접속 후 계정의 권한에 따라서 접근가능한 디렉터리 파일/업/다운로드가 모두 가능하며

상단의 터미널 -> 새 터미널을 통해서 

아래처럼 서버의 터미널도 사용이 가능합니다.

 

이렇게도 물론 사용이 가능하지만 보통의 경우 일반계정으로 파일관리를 하는게아닌 root 권한으로의 접근이 많이 사용합니다.

터미널의 경우 sudo를 통해 가능하지만 이왕이면 root로 접근하는게 제일좋긴하죠

 

다만 저의경우 기본 ssh 설정을 root는 password로 접속못하도록 prohibit-password를 사용하기때문에

ssh 키 등록을 통해 서버접근을 조금더 수월하게 해보도록 하겠습니다.

 

SSH Key 등록을 통해 원격접속하기

 

ssh key란 간단히 말해서 클라이언트와 서버와 key 인증을 통해서 인증하게되는걸 의미합니다.

사용하고있는 pc에서 key를 만들고 서버쪽에 해당 서버에 공개키를 업로드해서 등록해주면 됩니다.

 

이렇게 ssh key를 이용하면 접속시에 계정과 pw를 입력하지않아도 접속이 가능합니다.
물론 일반 password 대신에 pass phrase 를 등록하면 또 패스워드처럼 사용도 가능합니다.

 

진행과정은 Client에서 ssh key만들기 -> 공개키를 서버에 업로드하기 -> 업로드한 공개키를 원하는 계정의 .ssh 폴더에 이동시키기. -> 인증내용에 추가하기 입니다.

 

Client에서 ssh key 만들기

제가 사용하고있는 Windows를 기준으로 진행하겠습니다.
먼저 cmd창을 열어주세요. 그리고 아래명령어를 입력해서 키를 만들어줍니다.

 

ssh-keygen -t rsa -b 4096

만들때 위치와 passphrase를 입력하라고 나오는데 키인증이외에 pw로 한번 더입력하시고싶으시면 넣으시면됩니다.
비워놔도 무방.

 

이제 해당 위치로 가서 ssh 키 생성을 확인합니다.

 

기본경로는 C:\Users\[계정명]\.ssh 입니다.

여기서 id_rsa는 개인키로 절대 공유해서는 아되며 id_rsa.pub는 공개키로 이 키를 서버에 업로드해주시면됩니다.

 

처음 업로드이기 때문에 winscp를 통해 해주셔도 되고 cli 익숙하신분이라면

아까 그 cmd 화면에서
cd .ssh
scp id_rsa.pub [계정명]@[서버ip]:[홈경로] 로 업로드해주셔도됩니다.

 

가시성은 winscp 가좋습니다

 

업로드 후 putty로 ssh 접근 후 해당 파일을 접속시 사용할 계정의 .ssh/authorized 에 추가하겠습니다.

저같은경우 root 계정을 해당 키로 접속할 예정입니다.

 

cat id_rsa.pub >> /[계정명]/.ssh/authorized_keys 에 넣어주시면됩니다.

 

이렇게 키를 넣게되면 cmd창에서도 ssh로 pw없이 접속이 되고

 

 

VS Code에서도 root 계정으로 잘접근됩니다.

 

키위치는 아까 확인했던곳으로

 

 

이제 root로만 접근가능했던곳 수정가능했던게 다 됩니다!