CodeHoon

■ 환경 및 툴

→ Linux(Ubuntu), Apache, Nodejs, socket.io, javascript, html, css, vscode

■ 특이점 

→ 외부 접속을 허용하였는데, 해당 서버가 제대로 작동하지 않는 상황

Apache + Node.js + Express 를 통해 3000포트 접속을 허용하고 웹서버를 띄웠다.

이 때 외부 IP를 입력해서 들어간 경우에는 안되었고, vscode에서 웹브라우저를 띄웠을 때 및 localhost:3000 로 접속하였을 때는 동작하였다.

외부 아이피 주소 112.~ 로 접속하였을 때는 실패하였다. CORS 오류나면서.

아무래도 이전 포스팅과 연결되는 말인 것 같지만,

처음 이 현상을 발견하게 된 것이 VSCODE에서 뇌가 하얗게 되어 무지성으로 클릭하다가 우연찮게 발견하여 클릭하고 발견한 웹 브라우저 띄우기. 

예전에도 localhost 환경에서 axios를 사용할 때 해당하는 CORS 오류가 출력되었는데, 이 때 비슷한 에러가 출력되었던 것도 같다.

즉, 내부포트로 접속할 수 있는 환경에서 왜 굳이 외부포트로 접속하냐 이런 느낌.

로컬 호스트(localhost) 에서 REST API를 이용, Axios 를 이용, Ajax를 이용하는데에 있어서 CORS 에러가 자주 발생한다.

이 방법은 localhost 에서 발생하는 CORS 오류를 막는 것이다. 

(만약 PUBLIC 으로 배포하였을 때에는 해당되지 않는다.)

구글 크롬 extension의 CORS Changer를 사용하면 단번에 해결이 된다.

[ 다운로드 - 확장 - 새로고침 ]

이 세 단계로 모두 해결된다.

REST API - AXIOS 를 사용하는데에 자꾸 localhost에서만 해당 api를 가져올 수 없다고, CORS 에러가 발생하길래 어쩔 수 없이 사용하였다.

해당 내용처럼 잘 출력된다. 하지만 로컬에서는 안됐다는 점..

■ 에러내용

Access to XMLHttpRequest at 'request url' from origin 'http://localhost:8081' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.