CASE STUDY
하이트진로음료
기업 웹사이트 개편 및 보안 강화
Overview
프로젝트 개요
브랜드 8종을 담는 3개 국어 기업 웹사이트 개편과, 정기 보안 감사를 통한 취약점 조치·운영 보안 강화.
Background
브랜드를 보여주는 사이트에서, 운영되는 사이트로
하이트진로음료는 석수·퓨리스 같은 먹는 샘물부터 블랙보리, 테라 제로, 토닉워터까지 성격이 제각각인 브랜드를 함께 운영합니다. 기업 웹사이트는 이 브랜드들을 한자리에서 보여주는 동시에, 뉴스·공지·채용·고객문의·대리점 개설상담까지 실제 업무가 오가는 창구 역할을 해야 했습니다.
그래서 이 프로젝트는 화면을 다시 그리는 데서 끝나지 않았습니다. 콘텐츠를 담당자가 직접 관리할 수 있는 관리자 시스템, 국문·영문·중문 3개 국어 운영 체계, 그리고 공개 기업 사이트에 요구되는 수준의 보안을 함께 갖추는 것이 과제였습니다. O2O Mate는 프론트엔드 개편과 백오피스 구축, 정기 보안 감사를 이어서 수행했습니다.
메인 — 5개 대메뉴와 다국어·진로토닉몰 진입을 상단에 두고, 신제품 캠페인 슬라이더로 시작합니다
개편의 네 가지 축
브랜드 중심 정보구조
8개 브랜드를 컬러 타일 그리드로 배치해 한 화면에서 전체를 훑고 상세로 진입하도록 했습니다. 브랜드마다 고유 색을 그대로 살려 목록 자체가 브랜드 인덱스가 되게 했습니다.
3개 국어 운영
국문·영문·중문을 같은 CMS 안에서 관리합니다. 언어별로 페이지와 게시물을 따로 운영하면서도 메뉴 구조는 공유하도록 설계했습니다.
권한그룹 기반 백오피스
메뉴 관리, 게시판, 파일, 팝업, 채용공고를 담당자가 직접 다룹니다. 권한그룹으로 메뉴 단위 접근을 제어하고, 관리자 활동 로그를 3년간 보관합니다.
운영 자동화
Instagram 피드 자동 수집, 월간 운영 보고서, 개인정보 파기대장(PDF 확인서·XLSX 요약) 등 반복 업무를 시스템이 대신하도록 했습니다.
System 01
브랜드 — 색으로 구분하는 인덱스
브랜드가 여덟 개가 되면 목록은 금세 지루해집니다. 제품 사진을 나열하는 대신 브랜드별 대표 색을 배경으로 깔고 로고 타이포를 크게 얹어, 스크롤만으로 브랜드 라인업이 인지되도록 했습니다. 상세 페이지에서는 제품 라인업과 용량·패키지 정보를 브랜드 톤에 맞춘 레이아웃으로 전개합니다.
메인 BRAND 섹션 — 브랜드 고유 색이 그대로 타일이 되어, 목록이 곧 브랜드 인덱스로 읽힙니다
브랜드 목록에서 상세로 — 8종 라인업(좌)에서 개별 브랜드의 제품·패키지 정보(우)로 이어집니다
System 02
고객 접점 — 문의부터 대리점 개설까지
기업 사이트에서 실제 전환이 일어나는 곳은 브랜드 페이지가 아니라 문의 폼입니다. 고객 문의, FAQ, 대리점 개설상담을 각각 다른 성격의 화면으로 나눴습니다. 특히 개설상담은 단순 폼이 아니라 "왜 하이트진로음료 대리점인가"를 설득하는 랜딩 구조로 만들고, 본사 지원 정책 8종과 개설 절차 5단계를 거쳐 상담 신청으로 이어지게 했습니다.
개설상담 — 브랜드 파워, 본사 지원, 30년 Know-How 세 축으로 대리점 진입 이유를 설득합니다
본사 지원 정책 8종과 STEP 1~5 개설 절차(좌), 그리고 같은 흐름을 한 손으로 따라갈 수 있는 모바일(우)
Security
감사로 끝내지 않고, 다음 감사로 확인하기
공개된 기업 사이트는 취약점이 그대로 브랜드 리스크가 됩니다. 이 프로젝트에서는 보안 점검을 한 번의 이벤트로 두지 않고, 정적 코드 분석과 운영 서버 HTTP 점검을 묶은 감사를 네 차례 반복했습니다. 각 감사는 이전 회차에서 지적된 항목이 실제로 수정됐는지 코드 라인 단위로 다시 확인하는 것으로 시작합니다.
직전 감사에서는 이전 10건 중 8건 수정·1건 부분수정·1건 미수정으로 추적됐고, 신규로 발견된 항목을 심각도별로 분류해 다시 조치 대상에 올렸습니다. "고쳤다"는 보고가 아니라 다음 감사의 근거로 검증하는 구조를 만든 것이 이 작업의 핵심입니다.
조치한 주요 항목
저장형 XSS 차단
관리자 입력값이 공개 페이지에 비이스케이프로 출력되던 경로를 정리하고, SVG 업로드를 허용 확장자에서 제거해 스크립트 삽입 경로를 닫았습니다.
파일 접근 통제
파일 ID 순차 열거로 비공개 첨부에 접근할 수 있던 문제를 부모 게시물의 공개 상태 검증으로 막고, 삭제 경로에 realpath 검증을 추가했습니다.
Mass Assignment 제거
요청 값을 그대로 모델에 넘기던 컨트롤러를 검증된 값만 사용하도록 바꿨습니다.
보안 헤더·권한 체크
전용 미들웨어로 X-Frame-Options·X-Content-Type-Options·Referrer-Policy·Permissions-Policy·HSTS를 적용하고, 관리자 인증 미들웨어의 권한 검사 누락을 보완했습니다.
연혁 타임라인(좌)과 채용(우) — 인재상·전형절차·복지제도와 채용공고 게시판을 함께 운영합니다