[Troubleshooting] React + NGINX 배포 과정에서의 failed (13: Permission denied) 해결

 

React에서 프로젝트를 개발하고 배포하는 방법은 여러 방법이 있다. 요즘 많이 사용하는 것은 AWS의 amplify를 사용하여 배포하는 추세인 것 같다. 참으로 간편하게 배포할 수 있도록 되어 있고, 배포를 안내해 주는 여러 글들도 있다. 

 

하지만 현재 구동 중인 서버는 Ubuntu OS이고 주로 사용하는 서버 프레임워크는 NGINX이기 때문에 NGINX를 통하여 배포를 하려고 했다. React로 구현한 프로젝트는 간단하게 빌드 파일을 생성할 수 있으며, 해당 빌드 파일은 Serving 해 주기만 하면 된다.

 

근데 NGINX 모든 설정을 마무리 하고 서버를 구동하는 순간 Error 500과 동시에 의도된 페이지가 나오지 않는 문제가 발생했다. 에러를 확인해 보니 아래와 같은 에러가 띠용! 하고 나타난 것이다.

 

vim /var/log/nginx/error.log

 

failed (13: Permission denied)

 

위 에러는 사용자가 접속했을 때 NGINX에서 제공하려고 하는 파일에 대한 권한이 없는 문제인 것 같아. 여러 시도를 해 봤다.

 

1. Build 폴더의 권한을 변경 - 문제 해결이 되지 않았다.

2. 현 접속해 있는 계정의 그룹 변경 - 문제 해결이 되지 않았다.

3. `/etc/nginx/nginx.conf` 설정 파일 내의 `user` 값 변경 - 문제가 해결 되었다.

 

/etc/nginx/nginx.conf

 

기본 /etc/nginx/nginx.conf는 www-data가 기본 값으로 되어 있는데, 이 user 값을 현재 서버 배포와 관련되어 있는 유저로 변경해 주었더니 위 이슈가 해결되었다. 당연히 설정 변경 이후에는 NGINX를 재시작 해야 한다.