Skip to Content
Data Engineering솔루션 연동을 위한 Jupyter Hub Content Security Policy (CSP) 에러 우회 설정
📊 Data Engineering2017년 12월 8일

솔루션 연동을 위한 Jupyter Hub Content Security Policy (CSP) 에러 우회 설정

#jupyter#security#csp#data-engineering#flamingo

과거 당사 빅데이터 성능 관리 플랫폼인 빅데이터 모니터링 플랫폼의 제품 가치를 높이기 위한 미션 중 하나는, 데이터 사이언티스트들이 솔루션 화면 바깥으로 이탈하지 않고 화면 속에서 곧바로 코딩을 할 수 있게 만드는 것이었습니다.

이를 위해 플랫폼 웹 포털 UI의 특정 메뉴 탭 안에 Jupyter Hub 화면을 iFrame 태그로 렌더링하도록 기획을 잡았습니다. 하지만 개발망에서 테스트를 해보니 렌더링은커녕 크롬(Chrome) 브라우저의 콘솔 창이 새빨갛게 물들었습니다.

에러의 원인은 CSP(Content Security Policy) 위반이었습니다. Jupyter Hub가 구동되는 도메인/포트(8000)와 플랫폼 WAS가 구동되는 도메인/포트(8080)가 서로 달라(Cross-Origin), 최신 브라우저들이 “악의적인 클릭재킹(Clickjacking) 공격의 위험이 있다”고 판단하고 Jupyter 화면 렌더링을 냅다 막아버린 것입니다.

이를 해결하기 위해서는 Jupyter 서버 측 설정 파일의 HTTP 응답 헤더(Header)를 열어주어 플랫폼 도메인을 신뢰할 수 있게 만들어야 (Whitelist) 합니다.

해결 방법: frame-ancestors 헤더 추가

Jupyter Hub 환경에서 Default Spawner인 LocalProcessSpawner를 사용할 경우, Hub 프로세스 자체와 개별 유저가 띄우는 Single User Notebook 프로세스 두 곳 모두에 응답 헤더를 박아주어야 완벽히 뚫립니다.

1. Jupyter Hub 마스터 설정 수정

jupyterhub_config.py 파일의 밑단 쯤에 Tornado 웹 서버 설정을 주입하는 구문을 찾아 아래 내용을 덮어씌웁니다.

python
## Extra settings overrides to pass to the tornado application.
c.JupyterHub.tornado_settings = {
    'headers': {
        # 'self'는 로컬 요청을 허용하고, 그 뒤의 주소는 자신을 iFrame으로 부모창에서 품을 수 있도록 허용하는 화이트리스트 IP/Domain 입니다.
        'Content-Security-Policy': "frame-ancestors 'self' http://localhost:38080 http://flamingo-portal.exem.com"
    }
}

2. Single User Notebook 내부 설정 수정

실제 코딩이 이루어지는 개별 노트북 인스턴스의 헤더도 뚫어야 합니다. 통상적으로 /etc/jupyter/jupyter_notebook_config.py 경로의 기본 템플릿 파일이나 유저별 .jupyter/ 경로의 파일을 조작합니다.

python
c.NotebookApp.tornado_settings = {
    'headers': {
        'Content-Security-Policy': "frame-ancestors 'self' http://localhost:38080 http://flamingo-portal.exem.com"
    }
}

설정 파일을 저장한 뒤 백그라운드에 떠 있던 Jupyterhub 데몬을 내렸다가 다시 올리면(재기동), 플랫폼 대시보드의 특정 탭에서 이질감 없이(Seamless) 쏙 박혀 돌아가는 Jupyter 화면을 볼 수 있었습니다. 사용자 경험(UX) 측면에서 포털과 분석 인스프라의 융합을 만들어 낸 소소하지만 뿌듯한 트러블슈팅이었습니다.

Last updated on