개발팀장이 되면서 겪게된 점들 1

이미지
                                                         <팀원을 모집하기 위해 고군분투하는 모습이다. > 첫 한달  개발팀장을 맡다 2021년 5월 , 기존에 있던 CTO분이 휴직(개인사)을 하게 되면서    개발에 대한 모든 권한을 내게 일임하였다.   개발에 대한 모든 의사결정을 전부 내게 맡긴 것으로 ,   어느 정도 규모가 있는 회사의 의사결정권한을 갖게 된 것은 그만큼 내게 큰 신뢰가 있었음을   알수 있게해주는 대목이었다. 그러나 전혀 예측하지 않았던 상황이기에 준비가 되어있지 않았던만큼 처음에는 삐걱거렸다. 가장 첫번째로 어려움을 겪었던 것은 업무의 배분이었다.   관리자가 되니까 해야할일은 업무를 만들고 또 그것을 팀원들에게 분배하고 잘 되고있는지 취합하고 관리감독을 하는것이었다.   군 시절 장교로 복무하면서 겪어봤던 일이긴 했지만, 군복무 당시에도 그닥 잘 하지는 않았던 것 같다.   그럼에도 어쨌든 전반적인 시스템을 이해하고 있었고, 어떻게 구현해야할지에 대해서는 어느정도 경험이 쌓여있었기때문에 큰 문제가 없을 줄 알았다.   실무자로 일을 할 때에도 항상 업무를 받아서 하지는 않았다. 스스로 돌이켜보건대, 나는 주어진 업무가 없으면 스스로 만들어서 제안하고 기획하여 업무를 진행했다.  조그마한 스타트업이었던 첫 회사에서부터  내가 할일은 내가 만들어서 곧 잘했다. 어떤 큰 방향만 정해져있다면 그건 큰 어려움은 아니었다. 나에게 일은 항상 있었다.   매니저가되면서 달라진게있다면 내가 할일만 만드는 것은 아니라는 점이다 . 남이 할 일도 만들어줘야했다.  다행히 팀원들에 대한 면담을 실시한 결과,(팀원을 맡게되자마자 했던 부분)   마이크로 매니징을 원하지는 않았기때문에 큰 그림을 그리는 정도만 준비하면 됐었다.   문제는 내 실무를 동시에 진행하면서 팀원들의 업무 방향도 설정해야했기때문에 시간이 배로 들게 되었다는 점이다. 물론 두배로 일하지는 않았다. 대신에 내 실무시간을 줄였고

iframe 보안 문제 우회 및 해결법 2




iframe 보안 이슈를 우회하여 다른 여러 사이트를 화면에 표시하는 방법을 소개한다.

크롬에만 국한적인 방법이기때문에 정당한 해결책이라고 할 수는 없지만 이거라도 찾아낸 게 어딘가 싶다.


 - 해결책 = Chrome extension


크롬 확장프로그램이 바로 그 해결책이었다.

해결책의 시초는 다음 확장 프로그램이었다.  Split screen 이라는 프로그램이다. 

화면 분할이 되어지는 모습



처음 우리가 기획했던 기능이 화면분할이었는데, 이 프로그램이 구현하고 있었다. 
iframe을 쓰는 것은 동일했는데, 이 확장프로그램은 어떤 도메인이던 들어갈 수가 있던 반면에 
내가 만든 iframe에서는 자꾸만 SOP에 걸렸다.

도대체 무엇이 그 차이를 만들어내는 건지에 대해 구글링하고 탐색해보았다. 
그러다가 발견한 것이, 저 프로그램이 켜진 상태에서는 내 페이지에서도 어떤 웹사이트던 볼 수 있더라는 것이다. 

크롬 확장프로그램에 그 해답이 있다는 것을 알게된 것은 오래 걸리지 않았다.

chrome 브라우저에서 제공하는 chrome 객체에는 webRequest라는 멤버가 있었다. 
이 멤버는 http 요청에 관여할 수 있는 객체였는데, 

https://developer.chrome.com/extensions/webRequest 

이곳에 가면 자세한 API를 살펴볼 수 있다. onHeaderRecived 를 통해 리스너를 입혀주기만 하면 문제는 해결되는 것이었다. onHeaderRecived는 응답헤더를 받을때의 시점이다.

SOP를 해결하기위해 서버에서 온 응답http 헤더를 조작해주었다. 

x-content-security-options', 'x-webkit-csp', 'content-security-policy', 'x-frame-options
과 같은 보안 정책들에 관한 header들이 포함된 것을 무효화 시켰다. 

크롬 확장프로그램을 설치하게 되면 사용자는 감지할 수 없는 백그라운드에 javascript를 실행시킬 수가 있다. 

물론 그만큼 보안이 약해지기때문에 사용자는 신중하게 페이지에 접속을 해야한다. 잘못된 사이트에 들어가게되면 그 피해를 고스란히 보게 될 수 있기 때문이다. 

그래서 iframe에는 스크립트를 허용하지 않는 sandbox 속성을 걸어두는 것이 좋다. 



악성 스크립트가 작동되더라도 크롬 브라우저는 그 보안성이 뛰어나서 그렇게 걱정하지 않아도 된다.
다른 도메인으로 불러진 iframe 내부에서는 부모 페이지의 element들을 건드릴 수 없도록 되어있다. 
마찬가지로 부모페이지에서도 iframe 내부를 건드릴 수 없도록 막혀있다. 


결국 iframe 내부 정보를 드래그해서 부모페이지에 드랍시키겠다는 나의 생각을 실현시킬 수 없었다.




하지만 이번 기회를 통해서 http 에 대한 지식은 물론이고, 보안에 대해서도 좀더 깊이있는 고민을 할 수 있었다. 

진짜 맘먹고 악의를 가진 사용자가 서비스를 망가뜨릴 수 있겠다는 생각이 들었고 보안에 대해서 더 신중하게 다가서야겠다는 다짐을 하게되었다. 









댓글

  1. 마침 찾던 정보였는데 운 좋게도 이 블로그 글을 발견했네요.
    내용 참고하고 갑니다. 감사합니다.
    다만 저의 경우는 결국 확장프로그램을 설치하는 것으로 해결했는데 onHeaderRecived를 활용해서 헤더를 조작한다는 것은 어떻게 작업할 수 있는건지 궁금하네요.... IT초짜는 좋은 정보를 두고도 활용을 못합니다ㅠ

    답글삭제
    답글
    1. 크롬 브라우저안에서 돌아가는 자바스크립트의 경우 chrome 이라는 객체가 있어요! 물론 다른 브라우저에는 없겠죠.
      이 chrome 객체에 onHeaderRecived를 새로 오버라이드를 한다는 개념으로 보시면 되겠습니다.
      자세한건 제가 링크건 페이지에 잘 나와있어요.

      예시 코드를 한번 볼까요.

      chrome.webRequest.onHeaderRecived.addListener(
      callback, filter, opt_extraInfoSpec);

      어떤 느낌인지 아시겠죠. 우리가 흔히 마우스에 클릭 리스너를 거는 것과 동일합니다.
      기억이 가물가물한데, 저 callback parameter로 request 정보가 있을거에요.


      삭제
  2. 혹시 실례가 안된다면 onHeaderRecived에 코드를 공유 가능할까요 아무리 봐도 이해가 안되서요..

    답글삭제

댓글 쓰기

이 블로그의 인기 게시물

iframe 보안 문제 우회 및 해결법 1

개발팀장이 되면서 겪게된 점들 1