반응형

1. 시작전에~!

저번 포스팅 자료에서도 한번 언급드린것과 같이 아래 두 가지에 대한 조치가 필요합니다.

 

 1) HTTP 통신을 함에따른 접속 암호 및 정보 유출

 2) 우분투 유저가 분리되지 않아 발생하는 강력한 권한

 

각각에 대해서, 조치하지 않을 경우 어떤 문제가 있는지어떻게 조치할 것인지를 다루겠습니다.

 

2. HTTP대신 HTTPS로 설정하기

흔히 HTTP는 보안에 취약하다는 말이 많이있습니다. 먼저 왜, 취약한 것인지를 실제로 확인해보고 이 후 HTTPS로 Code-Server를 다시 구성한 후 차이점을 보겠습니다.

 

2.1 HTTP 통신 확인하기

HTTP 통신은 쉽게생각해서 평문전송이라고 생각하면됩니다. 웹브라우저에 입력되는 값을 별도의 암호화없이 전송하게됩니다.

만약 여러분이 카페에서 서버에 VS Code-Server에 접속하여 코딩을 하고있다고 가정해보겠습니다. 그리고 누군가가 카페에 설치된 공유기를 해킹한 상태라고 가정해보겠습니다.

(많은 카페들이 공유기 관리자 비밀번호를 수정하지 않은 상태로 사용하는 경우가 많기 때문에, 취약한 경우가 많습니다.)

 

해커는 공유기를 통해 연결된 모든 장비(노트북, 스마트폰 등)들의 통신데이터를 감시할 수 있습니다.

위 상황을 가정하고, 와이어샤크를 통하여 제 PC가 VS Code-Server가 설치된 오라클 클라우드와 통신하는 내용을 뽑아보겠습니다.

 

전송되는 패킷내용

위와같이 실제로 전송되는 피킷을 열어보면 친절하게 [패스워드는 ~~~~입니다.]라고 전송하고있는 것을 볼 수 있습니다. 내용을 보시면 아시겠지만, 접속 URL과 Port는 물론이며, Form 데이터에 Item name까지 친절하게 적혀서 전송되기때문에, 해커입장에서는 특정한 값들로만 필터링을 걸어두고 기다리고 있으면 사용자들이 전송하는 다양한 정보들을 쉬득할 수 있는 구조입니다.

 

만약 해커가 password 라는 값 하나로만 필터링을 걸어두고 기다리고 있었다고한다면, 여러분이 VS Code-Server에 접속하는 순간 해커가 서버의 IP와 Port, 그리고 패스워드까지 알게되고 손쉽게 접근할 수 있게됩니다.

 

2.2 HTTPS로 구성하기

위와같은 문제가있기 때문에, 대부분 이러한 서비스를 제공하는 프로그램들은 HTTPS를 이용하여 통신을 할 수 있도록 지원하고있습니다.

더보기

일반적으로 HTTPS를 사용하기 위해서는 먼저 '인증서'라는 것이 필요합니다.

여기서 조금 고민을 했습니다. CA(인증기관)를 통하여 저희서버에서 발급한 인증서가 맞다는 것을 공증받는 형태로 진행할지, 아니면 그냥 사설인증서를 통하여 구성할 것인지...

사용자 입장에서는 후자와 같이 사용할 경우, '신용할 수 없는 인증서입니다'와 같은 메시지가 브라우저 상단에 뜨게됩니다.

고민해봤는데, 일단은 목적이 '개인용'이기 때문에, 이부분은 별도 CA등록없이 진행하도록 하겠습니다. 이부분에 대해서 불편함이 있다면, 추후 내용을 추가하거나 수정하도록 하겠습니다.

VS Code-Server에서 HTTPS 통신을 하는 방법은 간단합니다.

code-server 환경설정 파일에 들어가서 "cert: true"로 변경해주면 자동으로 VS Code-Server가 실행될 때, 파일을 생성합니다.

sudo vi ~/.config/code-server/config.yaml

위와같이 수정 후 code-server를 실행하면 crt파일과 key파일을 생성하면서, 알아서 https로 Code-Server를 실행합니다.

아래와 같이 말이죠.

앞서 말씀드린것 처럼, 인증받지 못한 사이트이기 때문에 웹브라이저에서 경고창이 먼저 뜰 수 있습니다. 무시하고 연결해주시면 됩니다~ㅎ

 

이렇게 해주시고, 다시 와이어샤크로 데이터를 확인해보면, 아래와같이 데이터가 암호화되어 전송되고있는 것을 볼 수 있습니다.

(모든 웹 데이터가 암호화되기 때문에 실제로 저 데이터가 Password를 암호화한 값인지도 확인이 불가능합니다.)

이런식으로 암호화해서 전송되기 때문에, 혹시라도 전송되는 패킷데이터가 제 3자에게 노출되어도 안전하게 통신이 가능합니다.

 

3. User 분리하기

처음 기본으로 제공되는 ubuntu라는 계정은 sudo 권한을 갖고있는, 강력한 유저입니다.

때문에, VS Code-Server에 접근하여, 터미널(메뉴>터미널>새터미널)을 실행하면 이 강력한 권한을 사용할 수 있습니다.

root 권한 획득

위 처럼, 간단하게 root 권한을 취득할 수도 있습니다. 서버의 주인이 바뀌는 순간이죠...

이러한 문제를 해결하기 위해서, sudo 권한이 없는! VSCode를 위한 유저를 만들어줍니다.

 

sudo adduser (유저명)

저는 위처럼 vsapp라는 유저를 만들었습니다. 유저정보는 공백으로 만들었고요. 그리고 해당 유저로 변경한 후 해당 유저의 홈 디렉토리에서 code-server 명령을 수행해보았습니다.

sudo su vsapp       # 유저 변경(ubuntu > vsapp)
cd                  # vsapp의 홈디렉토리로 이동(/home/vsapp)
code-server         # code-server 실행

결과는 아래와 같습니다.

보시는것처럼, 마치 Code-Server를 처음 실행한거 같은 상황입니다.

넵, 맞습니다. 해당 홈 디렉토리는 새로 만들어졌고, 여기에는 설정파일은 물론이고, 좀전에 만든 인증서 파일들도 없습니다 ㅎㅎ

 

저번 포스터에서 중간에 '여기까지만 따라해주시고, 이제부터는 다음 포스터까지 다 보시고 따라와주세요!' 라고한 이유입니다 ㅎㅎ...

 

혹시 그냥 따라오셨다면... 복습하는 마음으로 설정파일을 수정해주세요~ ㅎㅎ

vi ~/.config/code-server/config.yaml

######### 설정파일 내용 ##########
bind-addr: 0.0.0.0:2001
auth: password
password: (사용자 암호)
cert: true

그리고 다시 실행해준 후, 터미널에서 명령어를 실행하면~!

 

위와같이, sudo권한이 없기때문에, 실행할 수 없다는 결과가 뜨는것을 볼 수 있습니다.

 

물론 막 생성된 계정이고, 별도의 권한도 없기 때문에, 해당계정으로는 타 소유주의 파일을 수정/삭제는 물론 폴더에 임의로 파일을 생성하는 것도 불가능합니다.

 

이렇게한다면, 조금은 안전하게 저희 서버를 지킬 수 있을꺼에요... ㅎㅎ

 

여기까지해서 VS Code-Server 구축부분은 일단 마무리하겠습니다.

 

다음에는 슬슬 지루하니, 파이썬+Flask를 이용해서 홈페이지 띄우는 부분을 다뤄보겠습니다~!

 

감사합니다.

반응형
반응형

1. 시작전에

Visual Studio Code Server는 MS에서 만든 VScode를 서버에 설치하여 어디서든, 무엇이든 웹 브라우저와 인터넷만 가능하다면 이를 통하여 접근하여 개발이 가능한 환경을 제공합니다.

다양한 확장 프로그램(플러그인)을 포함하고 있으면서도 나름대로 가벼운 프로그램이기 때문에, 이를 이용하여 서버에 직접붙어 프로그램을 개발하려고합니다.

 

물론 이러한 방식은 '보안'의 입장에서는 별로 좋지 못한 생각이라고 느껴집니다.

차후 운영할 서버에 직접붙어 개발을 하는만큼 악의적인 마음만 있다면, IDE를 통하여 얼마든지 서버를 마음대로 컨트롤 할 수 있기 때문입니다.

 

이는 VSCode 뿐만의 문제가 아니라, Jupyter Notebook Server도 동일합니다. 서버에서는 누가 접속했는지 판단할 수 없는데, 해당 프로그램의 소유자권한이 제한하지 않는 범위에서는 마음대로 터미널 명령들을 수행할 수 있고, 통제가 가능하기 때문입니다.

 

이러한 문제에 대해서도 차후 고민해보고 나름대로 해결방안을 가져가보도록 하겠습니다.

 

2. VSCodeServer 설치

VSCodeServer 설치는 정말 간단합니다.

친절한 개발자분께서 스크립트를 개발해주셨으니까요.

 - 관련된 내용은 다음 링크(https://github.com/cdr/code-server)를 참고해주세요.

 

서버에 code-server 설치는 아래 명령어 한줄이면 끝입니다.

curl -fsSL https://code-server.dev/install.sh | sh

Code-server 설치

위와같이 설치가 완료되면, 이제 설정파일을 수정해주겠습니다.

 

여기까지만 따라해주시고, 이제부터는 다음 포스터까지 다 보시고 따라와주세요!

 

설정파일 위치 :  ~/.config/code-server/config.yaml

( 만약 설정파일이 존재하지 않는다면, [code-server] 명령을 통하여 한번 프로그램일 실행 후 종료해주세요.)

bind-addr: 0.0.0.0:2001
auth: password
password: password_입력     << 실제 접속에 사용될 암호
cert: false

일단은 해당 설정파일을 열어, 위와같이 입력해주시고 저장해주세요. (password는 본인 스스로!)

 

그리고, 외부 접속을 위한 보안설정을 넣어줘야합니다.

 

보안설정은 이전에 말씀드린 것과 마찬가지로, 오라클 클라우드 홈페이지에서 1차적으로 진행해주시기 바랍니다.

(전 포스터 하단에 해당내용이 나와있습니다. 참고해주세용,,,, Link : https://youngq.tistory.com/95)

 

그.리.고!!!

 

우분투 자체에서도 iptables를 통한 보안설정이 필요합니다.

(ufw를 이용한 보안정책이 더 쉽고하긴한데, 오라클 클라우드에서 ufw로 정책을 지원하지 않는건지 적용을해도 잘 안되는것같아 iptables를 이용하게 되었습니다.)

 

iptables 설정과 관련된 부분은 내용이 많아 별도로 차후에 포스팅을 하겠습니다. 그렇기에 일단은 아래내용만 확인해주세요.

 

  ######### 2001번 Port를 목적지로하는 TCP INPUT을 허용하겠다는 내용 #########
sudo iptables -I INPUT 5 -i ens3 -p tcp --dport 2001 -m state --state NEW,ESTABLISHED -j ACCEPT
(NEW : 새로운 연결, ESTABLISHED : 기존 연결에 이어지는 데이터)

  ######### 변경내용 저장 #########
sudo cp /etc/iptables/rules.v4 /etc/iptables/rules.v4.bak        # 원본파일 백업

su -                                                             # root login(root만 수정가능)
iptables-save > /etc/iptables/rules.v4                           # 수정내용 덮어쓰기
exit                                                             # root logout

적용 후 [sudo iptables --list] 명령을 입력하면, INPUT 부분에 아래내용이 추가된 것을 볼 수 있습니다.

위와 같이 설정이 끝난다면, 외부에서도 해당 Port를 통해 접속이 가능한 상태가 됩니다.

 

code-server 명령을 통해 서비스를 실행하고 접속이 잘 되는지 테스트해보겠습니다.

code-server 명령으로 VSCodeServer 실행
정상적으로 연결되는 것을 확인
패스워드 입력시 접속되는 것을 확인

 

위와같이 정상적으로 서버에 설치된 VSCode를 웹브라우저를 통하여 접속할 수 있는 것을 확인했습니다~!

 

짝짝짝!

 

하.지.만~ 문제가 하나 있습니다.

 

이를 이용하여 코드를 구현하는것은 전혀 문제가 아니지만, 역시나 또 보안상에 문제가 조금 남아있습니다.

 

가장 큰 문제는 두 가지입니다.

 1) HTTP 통신을 함에따른 접속 암호 및 정보 유출

 2) 우분투 유저가 분리되지 않아 발생하는 강력한 권한

 

위 두가지 문제는 카페와같은 공용공간에서 악의적인 마음만 먹는다면 손쉽게 여러분의 서버의 IP를 확인하고, VSCodeServer에 접속할 수 있고, 안전한 SSH 접속을 우회하여 마음대로 터미널 명령을 수행 할 수 있습니다.

 

이러한 문제에대한 해결은 다음포스팅에서 다루겠습니다~ 감사합니다.

반응형
반응형

MAC에서 VSCode를 사용하여 C언어와 C++을 사용하는 방법

전편에 이어서 작성된 글입니다. 본편에서는 디버거 연동을 다룹니다.


전편에 이어서 이번에는 디버깅을 하는 과정을 다루겠습니다.



[왼쪽에 벌레잡는 그림] -> [실행버튼 클릭시 위와같이 선택사항 표시] -> [C++(GDB/LLDB) 선택]]


클릭하면 launch.json파일이 생성됩니다.


기본 상태는 아래와 같습니다.



전편에서 tasks.json 파일을 수정해보셨기 때문에 대충 감이오실거에요.


설명은 중략하고 아래와같이 launch.json파일을 수정합니다.



{ // IntelliSense를 사용하여 가능한 특성에 대해 알아보세요. // 기존 특성에 대한 설명을 보려면 가리킵니다. // 자세한 내용을 보려면 https://go.microsoft.com/fwlink/?linkid=830387을(를) 방문하세요. "version": "0.2.0", "configurations": [ { "name": "(lldb) Launch", "type": "cppdbg", "request": "launch", "program": "${fileDirname}/${fileBasenameNoExtension}.out", "args": [], "stopAtEntry": false, "cwd": "${workspaceFolder}", "environment": [], "externalConsole": false, "MIMode": "lldb", "osx": { "MIDebuggerPath": "/Applications/Xcode.app/Contents/Developer/usr/bin/lldb-mi" } } ] }


대략적으로 보면, 전편에서 build한 파일 [파일명.out]이라는 녀석을 디버깅 할 것이라는 거고, 디버깅에 사용할 디버거는 lldb입니다.


다만, 별도로 설치하지 않고, xcode를 설치하면서 따라온 녀석을 사용합니다.


마지막줄에 MIDebuggerPath 부분이 디버거의 위치를 지정하는 부분인데, 저같은 경우에는 저 경로에 디버거가 존재했습니다.


다들 비슷하겠지만, 혹시 저대로 설정하고 실행했을 때, 디버거를 발견하지 못했다는 애러가 발생하면, 확인해보시기바랍니다.



2018/12/29 - [IDE/VScode] - [MAC] VSCode로 C/C++ 사용하기 (1/3)

2018/12/29 - [IDE/VScode] - [MAC] VSCode로 C/C++ 사용하기 (2/3)



반응형

'IDE > VScode' 카테고리의 다른 글

task.json 파일  (0) 2019.07.01
[MAC] VSCode로 C/C++ 사용하기 (2/3)  (8) 2018.12.29
[MAC] VSCode로 C/C++ 사용하기 (1/3)  (0) 2018.12.29
반응형

MAC에서 VSCode를 사용하여 C언어와 C++을 사용하는 방법

전편에 이어서 작성된 글입니다. 본편에서는 프로그래밍과 build까지를 다룹니다.


1. 파일생성 및 프로그래밍

화살표순서로 따라가주세요.



[왼쪽위 탐색기 클릭] -> [폴더 열기] -> [새로움 폴더] -> [생성된 폴더로 이동해서 열기클릭]


그럼 위와같이 새로운 작업영역이 생성됩니다.


그럼 먼저 hello.c hi.cpp 이라는 두개의 파일을 생성해보겠습니다. 그리고 두개의 파일을 담고있는 tutorial이라는 폴더를 생성하겠습니다.




위 사진에서 왼쪽 상단에보면 + 표시가 붙은 두 녀석을 볼 수 있습니다. 둘 중 왼쪽은 파일을, 오른쪽은 폴더를 생성하는 아이콘입니다.


오른쪽 폴더생성을 눌러서 tutorial을 생성하고 이 후 왼쪽 파일생성을 클릭해서 hello.c와 hi.cpp을 만들어주시면됩니다.


완료되면 위와같이 c파일은 C라는 표시가 cpp파일은 C++표시가 자동으로 생성됩니다.


< C언어 >


< C++ 언어 >



위와같이 C와 C++로 작성된 두개의 프로그램을 작성했습니다.


그럼 이제 실행할수있는 파일로 만들어야합니다.


우리 맥 유저는 리눅스의 친구 gcc와 g++을 이용하도록 하겠습니다.


명령어 : Command + Shift + b


클릭하시면 '실행할 빌드 작업을 찾을 수 없습니다~ '라고 나옵니다. 그녀석을 클릭해주시고, '템플릿에서 tasks.json파일 만들기' 클릭, 'Others' 클릭



여기까지 잘 따라왔다고 생각합니다~


이놈을 클릭하게되면 왼쪽에 tasks.json파일이 생성됩니다. 클릭해서 들어가보시면 아래와 같이 되어있습니다.



맞이시죠?


우리는 요놈을 아래와 같이 수정합니다.


{ // See https://go.microsoft.com/fwlink/?LinkId=733558 // for the documentation about the tasks.json format "version": "2.0.0", "tasks": [ { "label": "build_gcc", "type": "shell", "command": "gcc", "args": [ "-g", "-o", "${fileDirname}/${fileBasenameNoExtension}.out", "${file}" ], "group": { "kind": "build", "isDefault": true } }, { "label": "build_g++", "type": "shell", "command": "g++", "args": [ "-g", "-o", "${fileDirname}/${fileBasenameNoExtension}.out", "${file}" ], "group": { "kind": "build", "isDefault": true } } ] }

위에서부터 tasks.json파일을 천천히 한번 보겠습니다.

 4번 줄) "tasks" :  -> 뒤에 오는내용이 수행할 작업에 대한 내용입니다.

 6번 줄) "label" :  -> 중괄호로 묶여있는 부분의 이름입니다. 이 후 Command + Shift + b 를 눌렀을 때 표시되는 내용이기도 합니다.

 7번 줄) "type" :  -> 작업이 수행되는 공간입니다.

 8번 줄) "command" :  -> 작업공간에서 수행할 명령입니다.

 9번 줄) "args" :  -> 위에 command에 적어준 명령의 파라미터를 넣어줍니다.

 10번 줄) "-g"  -> 디버깅을 위한 옵션입니다.

 11번 줄) "-o"  -> 출력파일의 이름을 정의해줄때 사용합니다.

 12번 줄) "${fileDirname}/${fileBasenameNoExtension}.out"  -> 파일의 현재 디렉토리에 파일명.out 파일을 생성합니다.

 13번 줄) "${file}"  -> 현재 파일을 의미합니다. 해당 파일이 여기서는 gcc의 입력이 됩니다.


14번째 줄 부터는 현재와는 상관없는 부분이며, 아래의 C++을 위한 g++설정은 gcc와 동일합니다.


이렇게 tasks.json파일을 완성하고 저장하신 후 다시 hello.c파일로 돌아와 Command + Shift + b 명령을 클릭해보세요.




짠~! 방금 설정한 두 task가 보이게됩니다.


작업에 따라 C언어로 작성된 녀석은 gcc로, C++로 작성된 녀석은 g++로 build해주시면 됩니다~!


build 작업이 끝나면 좌측에 다음과 같이 두개의 파일이 새로 생긴것을 확인 할 수 있습니다.




그럼 마지막으로 실행은 어떻게할까?


간단합니다. tasks.json파일을 다시 조금 손봐주시면 됩니다.


아래와 같이 말이죠.



{ { // See https://go.microsoft.com/fwlink/?LinkId=733558 // for the documentation about the tasks.json format "version": "2.0.0", "tasks": [ { "label": "build_gcc", "type": "shell", "command": "gcc", "args": [ "-g", "-o", "${fileDirname}/${fileBasenameNoExtension}.out", "${file}" ], "group": { "kind": "build", "isDefault": true } }, { "label": "build_g++", "type": "shell", "command": "g++", "args": [ "-g", "-o", "${fileDirname}/${fileBasenameNoExtension}.out", "${file}" ], "group": { "kind": "build", "isDefault": true } }, { "label": "exec", "type": "shell", "command": "${fileDirname}/${fileBasenameNoExtension}.out", "group": { "kind": "build", "isDefault": true } } ] }


큰 차이는 없습니다.


마지막에 exec라는 녀석을 추가했을 뿐이니까요.


이렇게 해준 후 다시 Command + Shift + b를 클릭해주시면 exec라는 녀석이 등장합니다. 그리고 실행~!




그럼 하단 터미널에 C언어로 작성된 프로그램이 실행된 결과를 알 수 있게됩니다~!!!!


후~ 그럼 다음 포스팅에서는 디버깅 설정에대해 말씀드리겠습니다.


2018/12/29 - [IDE/VScode] - [MAC] VSCode로 C/C++ 사용하기 (1/3)


반응형

'IDE > VScode' 카테고리의 다른 글

task.json 파일  (0) 2019.07.01
[MAC] VSCode로 C/C++ 사용하기 (3/3)  (2) 2019.01.02
[MAC] VSCode로 C/C++ 사용하기 (1/3)  (0) 2018.12.29
반응형

MAC에서 VSCode를 사용하여 C언어와 C++을 사용하는 방법

 > VSCode설치부터 C와 C++로 작성된 프로그램을 빌드, 실행, 디버깅하는 과정을 담고있습니다.

 > 내용 정리를 위한 포스팅이기 때문에 내용에서 생략된 부분이 많을 수 있으며, 잘못된 부분이 존재할 수 있습니다.





 1. VSCode 설치하기

VSCode는 MS에서 공개한 가볍고 간단하며 많은 언어를 이용한 개발환경을 구축할 수 있는 프로그램입니다.

설치는 간단합니다.  클릭! 링크에 들어가셔서 그냥 다운로드하고 설치하시면 끝



2. VSCode에서 C와 C++ 작성하기

설치하기 실행하면 짠~ 하고 바로 튀어나옴, 다른 IDE와 다르게 초기 실행하는데 오랜 시간이 걸리지 않아서 행복

약간 불편한게 있다면, 영어라는거? 하지만 한국어로 변경하는건 간단합니다.


처음이라면 조금 당황할 수 있지만, VSCode의 경우, 거의 모든 셋팅들이 Json파일을 수정해 주는 것으로 이루어진다는 사실~!!!


익숙하지 않다면 그냥 따라오세요~!



명령어 : command + shift + p


를 누르면 상단에 명령 팔레트라는 녀석이 표시됩니다. 거기에 아래와 같이 입력하고 클릭해주세요



명령 팔레트에 language라고 검색했을 때 나오는 추천결과 중 ,Configure Display Language 클릭~!




그럼 locale.json 파일이 실행되는데, 여기서 locale을 en -> ko 로 변경해주시고, Command + S 로 저장 후 재실행해주세요~!


짠~ 한글로 변경 끝


다음으로 C와 C++을 작업을 위한 확장 프로그램을 설치합니다.


좌측에 위와같이 생긴 녀석을 클릭하시면 마켓으로 이동합니다.


거기에서 C 라고 검색하면 나오는 아래 요 녀석을 설치하고 재실행을 클릭~!




여기까지 했으면 기본 준비는 끝~ 바로 이어서 프로그래밍 과정에 대한 설명을 시작하겠습니다. 다음 포스터를 확인해주세용~!

반응형

'IDE > VScode' 카테고리의 다른 글

task.json 파일  (0) 2019.07.01
[MAC] VSCode로 C/C++ 사용하기 (3/3)  (2) 2019.01.02
[MAC] VSCode로 C/C++ 사용하기 (2/3)  (8) 2018.12.29

+ Recent posts