AWS 서버에 nginx 설정 후 403 forbidden 에러 대처하기

일단 AWS EC2 서버를 생성하고 nginx를 설치해보기로 맘먹고 검색을 해봤다. 이미 누군가 매우 잘 정리해놔서 일단 그대로 아무생각 없이 따라 치기 시작!!

http://blog.jidolstar.com/919

내가 위 링크와 다르게 설정한거라곤 php extension 밖에 없다. 나는 많은 extension이 필요 없어서 php54-devel php54-mysql php54-dg 정도만 설치했다.

그리고 실행!! 하지만 뚜둥!!

403 forbidden

아 이거 머지?… 하라는대로 했는데 왜 안되는거야? 했다가 403 forbidden 에러는 사실 권한 설정과 매우 밀접하게 관련되어 있기 때문에 폴더 권한 설정을 한번 점검해봤다. 이전에도 이와 관련된 글을 하나 쓴적이 있다.

곰곰히 생각해보니 내가 다른 설정을 추가한게 있다. 바로 nginx의 문서 root의 위치다! AWS에서 EC2 서버를 생성하면 기본으로 ec2-user 계정을 하나 생성해주는데, 여기에 자신의 계정을 따로 만들어주지 않는이상 대부분 ec2-user 라는 계정을 그대로 사용한다. 나도 귀찮아서 그냥 사용했다. 그래서 nginx의 루트 경로를 /home/ec2-user/www/nginx-root 위치에 생성했다.

여기서 잠깐! 자식에서 부모 폴더까지 권한 정보를 한번에 보자!

403 forbidden 에러가 발생 했을때 분명 www 폴더와 그 하위 폴더 권한이 제대로 됐는데 왜 안되지? 라고 고민하지말고 부모 권한도 점검해야한다. 이때 사용하는 명령이 namei 다.

$> namei -vl nginx-root
f: /home/ec2-user/www/nginx-root
dr-xr-xr-x root     root     /
drwxr-xr-x root     root     home
drwx------ ec2-user ec2-user ec2-user
drwxrwxr-x ec2-user ec2-user app
drwxrwxr-x ec2-user ec2-user www
drwxrwxr-x ec2-user ec2-user nginx-root

위에서 보면 ~/www/nginx-root 경로가 있음을 알 수 있다. EC2로 생성된 계정의 홈 디렉토리의 권한이 700로 되어 있기 때문에 그 하위 자식 폴더가 아무리 755 권한으로 되어 있다한들 접근할수 없다. 그래서 ec2-user 계정의 권한을 바꿀까도 생각했는데 그러면 보안의 구멍이 하나 뚫리는거라.. 그냥 755 권한으로 열려있는 var/www/ 위치로 루트 위치를 변경했다.

요건 그냥 참고

또 하나 알아둬야 할게 있는데 바로 파일 권한이다. 파일 권한은 644 이상이 되어야 forbidden 에러를 피할수있다

동적으로 삽입된 CSS 배경 이미지 가운데 정렬하기

요즘 바빠서 블로그 참 잘 안하는데… 일단 요 몇일 겪은 일들을 중심으로 간단히 메모라도 해야겠다.

배경 이미지 중앙정렬

보통 CSS를 이용해 배경 이미지를 중앙 정렬하고 싶을 경우 아래와 같이 많이 사용한다.

div{
    background: url('/imgurl') no-repeat;
    background-position: center;
}

사실 위와 같은 코드는 아래와 같이 한줄로 축약할수도 있다.

div{
    background: url('/imgurl') no-repeat center;
}

동적으로 배경 이미지 추가

그럼 이제 JS코드를 이용해 동적으로 이미지를 추가해보자.

var images = [10장의 이미지URL이 셋팅되어 있다고 가정];
var slides = $('.slide'); // .slide로 지정된 클래스도 이미지 갯수 만큼 있다고 가정. 
images.forEach(function(image, i){       
   slides[i].css({'background': 'url(' + image + ')'});
});

뭐 대충 위와 같이 간단하게 backgrund 속성에 url로 이미지를 추가할지도 모르겠다. 하지만 여기서 주의할점은 위와 같이 축약형 backgrund 속성을 사용하게 되면 기존에 풀어서 쓴 background-postion 속성을 덮어버리게 된다. 왜냐면 동적으로 삽입되는 녀석은 inline 스타일로 가장 우선순위가 높기 때문이다. 따라서 위와 같이 쓰면 가운데 정렬이 아닌 좌상단을 기준으로 정렬될 것이다.

문제 상황 바로 잡기

그래서 inline으로 스타일을 삽입할때는 항상 주의해야한다. 특히 축약형을 쓸때는 더더욱 주의하자. 위의 문제를 해결할때는 간단히 축약형이 아닌 일반 속성을 사용한다.

slides[i].css({'background-image': 'url(' + image + ')'});

nodejs winston 모듈을 이용해 로컬타임 출력하기

노드에서 많이 쓰이는 Logger 모듈 3가지

일단 morgan 같은 경우엔 Express4에서 정식 로거 모듈로 사용되고 있고, winston과 bunyan 모듈은 둘다 나름의 특징이 있어서 뭐가 더 좋다라고 할수는 없다. 그냥 취향에 맞는 녀석을 선택해서 쓰면 될것 같다. 둘을 비교한 내용은 이미 검색하면 많이 나오니까 요 포스트로 대신한다.

winston 모듈을 이용해 자동으로 타임로그 찍기

사실 해당 문서를 잘 읽어보면 아래와 같은 단락이 나오는데 예제가 없다보니 어떻게하라는거지? 라고 생각할수도 있다.

timestamp: Boolean flag indicating if we should prepend output with timestamps (default false).
If function is specified, its return value will be used instead of timestamps.

검색해보니 요렇게 써보라는 예제를 찾았다.

var winston = require('winston');
var logger = new (winston.Logger)({ 
    transports: [ new (winston.transports.Console)({ timestamp: true}) ]
});

오예!! 간단하구만…. 이렇게 생각했는데 출력된 로그를 보니 아래와 같이 기준시간이

2014-10-13T02:00:00.231z - info: 어쩌구 저쩌구....

그래서 좀더 검색을 해봤더니 commom.js 모듈을 직접 수정하라는 글도 찾았다.
http://blog.whitelife.co.kr/154

하지만 결론은 그냥 요렇게 하면된다.

var winston = require('winston');
var moment = require('moment');

var logger = new (winston.Logger)({
    transports: [
      new (winston.transports.Console)({
        timestamp: function(){
          return moment().format("YYYY-MM-DD HH:mm:ss.SSS");
        }
      })
    ]
});

오늘 얻은 교훈

사실 문서에도 함수를 지정할수있게 써 있는데 예제가 없으니 대충보고 없네..하고 넘어가는 습관 -_-;;;; 영어는 꼼꼼히 읽자!