Dandy Now!
  • [ 언어·프레임워크/React.js ]
    [React.js] 리액트 프로젝트 우분투 서버에서 구동하는 방법(npx, nginx 사용)
    2025-02-10 18:16:50
    여기에서는 리액트 프로젝트를 우분투 서버에서 구동하는 방법을 다루고자 한다. 먼저 프로젝트 빌드부터 해보자!1. 프로젝트 빌드리액트 프로젝트의 package.json에 설정된 빌드 명령어를 사용하더 프로젝트를 빌드한다. 아래는 명령어 예제이다.npm run build 빌드가 완료되면 index.html이 포함된 build 폴더가 생성된다.2. 구동 명령2-1. npx로 구동npx로 간단하게 구동해 볼 수 있다. 프로젝트 경로에서(build 경로로 이동할 필요가 없다.) 아래 명령어를 실행하면 빌드된 프로젝트가 포그라운드에서 구동된다.npx serve -l [실행할 포트 번호] -s build예를 들어 3000번 포트로 프로젝트를 구동하고 싶다면 아래와 같이 명령어를 작성하면 된다.npx serve -l ..
  • [ CS/Linux ]
    [Linux] 이미지 업로드 실패 : nginx 관련 PUT 413 (Request Entity Too Large) 에러
    2024-03-27 10:51:40
    1. PUT 413 (Request Entity Too Large) 에러 서버 이전 후 기존에 아무 문제 없이 운영하던 애플리케이션의 이미지 업로드 기능이 작동하지 않는 문제가 발생했다. 이미지 업로드 시도 시 콘솔에서 CORS 에러가 발생한 것을 확인할 수 있었다. node.js로 작성된 이미지 서버에서 모든 CORS 정책을 허용을 하였음에도 해결되지 않았다. 즉 콘솔에 표면적으로 드러난 CORS 에러가 원인이 아니라는 것을 짐작할 수 있었다. 확인 차 크롬 브라우저 CORS 허용하여 테스트해보았다. 더 중요한 에러 메시지는 "PUT 413 (Request Entity Too Large)" 임을 확인했다. 2. nginx의 default 설정에 client_max_body_size 추가하여 해결 이미지..
  • [ 언어·프레임워크/React.js ]
    [React.js] Socket.io SSL적용 문제
    2023-08-11 10:25:40
    https 서비스에서 Socket.io를 이용해 소켓 통신을 연결하고자 하였다. https 서비스이기 때문에 소켓도 SSL 인증이 필요했다. 간편한 방법인 Nginx를 이용해 ws를 wss로 변환하고자 하였다. 그런데 콘솔에서는 아래와 같은 에러를 하염없이 뱉어 냈다. net::ERR_SSL_PROTOCOL_ERROR 오늘 비로소 해결했는데 해결한 방법은 Nginx의 default 파일에 작성한 server의 server_name을 클라이언트에서 호출하는 것이었다. 그전에는 계속 IP주소로 연결 시도를 했었는데 실패했었다. Nginx default에 작성한 내용은 다음과 같다. server { listen 443 ssl; server_name wss.bla.com; ssl_certificate /bla ..