프론트의 입장에서 해킹을 막는 최소한의 보안법

김현재·2022년 8월 28일
0
post-thumbnail

네 이글을 작성하는 이유눈..저번주에 회사 서비스에서 디도스 공격을 받았기 때문에..
소잃고 외양간 고치는 격이지만, 앞으로 신규 프로젝트 시 사전에! 미리! 방지하고자 잊지 말자고 작성해봅니다..

1. 서버에 SSL인증서 설치 및 사용하기

너무 기본 중에 기본이지만..dev 서버나 개인 프로젝트 서버 등 귀차니즘에 의해 SSL을 설치 하지 않는 경우도 있을 수 있기에,,무조건 챙길 것

2. IP 주소로 직접적 접근을 막기

대부분의 무료 SSL인증서의 경우 DV 즉, 도메인에대한 인증서만 지원해주어, ip주소는 https 등으로 보호할 수 없다.

만약 해커가 ip주소를 알아낸다면, 속절없이 뚫릴 위험요소가 많다..!

이를 방지하기 위해 ip주소로 접근 시 바로 도메인네임으로 redirect를 시켜주거나 not found 등을 리턴해주는 방식으로 서버를 세팅해둔다

    
    // 리다이렉트 케이스
    server {
    	listen 80;
    	server_name $ip주소;
    	return 301 https://$도메인주소입력$request_uri;
    }
    
    // 접근 막는 케이스
    server {
    	listen 80;
    	server_name $ip주소;
    	return 444; // 444는 응답없음을 반환함
    }

3. user-agent 설정

크롤링 봇 등을 통해 들어오는 request는 브라우저와 user-agent가 다르다. 이런 경우를 방지하기 위해 user-agent 설정에 크롤링 봇에서 오는 request는 다 차단시킨다.

주의 ) 그래도 request는 들어오기에 통신비용은 발생한다는 점 유의!

    // nginx.conf 또는 sites-availables/default
    server {
    	// 위에 생략..
    	// 아래 string 부분에다가 막고싶은 크롤링 봇들을 기재해준다
    	if ($http_user_agent ~* "Paros|ZmEu|nikto|dirbuster|sqlmap|openvas|w3af|Morfeus|JCE|Zollard|Arachni|Brutus|bsqlbf|Grendel-Scan|Havij|Hydra|N-Stealth|Netsparker|Pangolin|pmafind|webinspect") {
            return 404;
        }
    }

4. robots.txt 설정

robots.txt를 통해서도 크롤링을 방지할 수 있다.

허나, robots.txt에는 한계가 있는게..보통 악질적인 이유로 크롤링을 하는 경우 robots.txt에 기재해놔도 알아서 다 피해가..는 경향이 있다. (검색엔진들이나 robots.txt를 잘 지킨달까..그렇기때문에 역으로 SEO를 고려해서 기재해야함!)

하지만 안하는것보다는 나으니 설정해둔다

  // 구글, 네이버 검색엔진을 제외하고는 다 차단시킴
  user-agent: *
  Disallow: /
  user-agent: Googlebot, Googlebot-news, Googlabot-image, Yeti,
  Disallow: 

5. XSS 차단 확인

혹시 서비스 내에 XSS 접근 시도가 가능한지 확인해본다.

프론트 서버에 해커가 접근해서 스크립트를 심어놓으면, 백엔드에서 거르기가 쉽지 않기때문에 필수 확인할 것.

요즘 라이브러리들은 보통 알아서 다 차단해두긴 하지만, 버전에 따라 다르므로 반드시 버전 확인 후 적절한 대응을 해야한다.

(JSX기반의 라이브러리들은 모두 escape한 후 렌더링하기때문에 XSS로부터 상대적으로 안전한 편,,)

6. 드래그 금지, 우클릭 금지 시키기

중요한 정보가 아니거나, 공유가 되어도 큰 상관이 없는 정보라면 드래그, 우클릭을 허용하여도 큰 상관이 없지만, 운영중인 서비스는 B2B이고, 정보제공 서비스이기 때문에 정보가 유출되지 않는게 중요했다.
그렇기때문에 해당 기능을 추가해줬다..

// app.js 같은 최상단 부분에 기재해주면 됨
  useEffect(() => {
    // 우클릭 방지
    document.addEventListener('contextmenu', function (e) {
      e.preventDefault()
    })
    // 스크롤 방지
    document.addEventListener('selectstart', function (e) {
      e.preventDefault()
      return false
    })
  }, [])
profile
쉽게만 살아가면 재미없어 빙고!

0개의 댓글