Nuke Olaf - Log Store

blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. 프론트엔드에서 XHR 로 백엔드에 데이터를 요청하려고 했으나, 다음과 같은에러가 뜨면서 실행이 안된다. CORS 정책이라고 해서 보안상의 이유로 다른 도메인에 ajax 요청을 보내지 못하게 하는 거라고 나온다. CORS 란, 동일한 도메인에서만 해당 도메인에 요청을 보낼수 있는것이라고 나온다. 해결방법은 여러가지가 있는데, 서버에서 Access-Control-Allow-Origin 설정을 통한 요청을 허용하는 방식을 사용했다. 서버에서 Access-Control-allow-origin 설정을 통한 요청 허용 apache ht..

내 아파치 웹 서버에는 프론트엔드와 백엔드 파일들이 혼재되어있다. 프론트엔드와 백엔드를 완전히 분리하기 위해 서버를 2개로 분리할 것이다. 아파치의 httpd.conf 에 들어가보면 server root 가 /usr/local/apache2.4 로 되어있다. 서버 루트를 두개 만들어놓고, 두 루트에 각각 프론트엔드와 백엔드 파일들을 위치시킬 것이다. 검색어는 multiple document root 검색하다보니, Apache Virtual Host 를 사용하여 단일 컴퓨터에서 둘 이상의 도메인을 호스팅할 수 있다고 한다. Web Server 에는 기본적으로 존재하는 Host가 있는데, 이를 Main Host 라고 한다. (여기서 host 란 인터넷을 통해 다른 컴퓨터들과 쌍방향 통신이 가능한 컴퓨터) 하..

1. 태그의 a 는 anchor 를 뜻한다. anchor 란, 닻을 의미하는데, 닻이란 배를 한 곳에 멈추어 있게 하기 위해 줄에 매어 물 밑바닥으로 가라앉히는 갈고리가 달린 기구를 말한다. a 태그는 웹페이지와 웹페이지를 연결하는 중요한 요소이다. a 요소가 없다면 모든 웹페이지를 주소를 일일히 치면서 이동했을 것이다. 2. 태그의 기능 a 요소에는 두 가지 기능이 있다. (1) 링크로서의 기능 (2) 앵커(닻)으로서의 기능(링크의 타깃이 되는 기능) 즉, a 링크의 href 에 상술된 주소로 웹페이지를 이동할 수도 있지만, a 태그에 name 속성을 주면, 페이지 내부에서 해당 name 의 a 링크 위치로 이동할 수 있다는 뜻이다. 그러나 요즘은 a 태그에 name 속성을 주기보다는 내의 요소에 id..

HTML 태그들을 공부할때 나왔던 블록 태그와 인라인 태그 키워드에 대해 제대로 공부하지 않아서, 웹 페이지의 구조와 표시방법에 대한 제대로된 이해가 없는 상태였다. 그래서 HTML 에 CSS 가 먹히지 않는 등 여러 문제가 있었다. 블록 태그와 인라인 태그에 대해 공부하고 정리함. block 의 사전적 의미는, (단단한) 사각형 덩어리를 뜻한다. inline 의 사전적 의미는 직렬의, 일렬로 늘어선 이라는 의미이다. 1. block 태그란?, inline 태그란? 모든 HTML 요소들은 스타일링을 위해 각 요소의 특성에 따른 default display value(기본 표시 값)를 가진다. default display value 는 블록 레벨 요소(Block-level Elements) 와 인라인 요소..

PHP Warning: fopen() Error: failed to open stream: Permission denied 위의 PHP 코드로 POST 메서드를 통해 받아온 데이터를 이용해 파일을 만들어서 data 라는 디렉토리에 저장하려고 했다. 하지만 어째서인지 파일이 만들어지지 않았다. apache 의 error.log 를 보니까 이렇게 나온다. PHP Warning: fopen() Error: failed to open stream: Permission denied 권한문제로 인해 파일이 작성되지 않는 듯 했다. data 디렉토리의 권한을 777 로 바꿔봤다. 이렇게 바꿔주니까 해결이 되었다. 처음에는 sudo su 로 root 계정에서 chmod 를 해주었었는데, 해결이 안되었다. 그런데 ola..

form 태그의 form 이란, 종류, 방식, 서식 이라는 뜻이다. 사용자에게 "어떠한 입력값을 받는" 형식을 표현하고 싶을때, 즉 정보를 제출하기 위한 대화형 컨트롤을 포함해야 할 때, HTML 의 form 태그를 이용한다. form 태그의 요소는 form 의 범위를 표시하며, 사용자의 입력을 위한 다양한 형식의 컨트롤 (입력필드, 버튼 등)로 구성된다. 이러한 사용자 입력을 통해 데이터를 수집하는 컨트롤들이 모여있는 곳을 폼이라고 생각하면 된다. 폼 요소는 블록 레벨 요소이며, 문서 전체를 폼으로 지정할 수도 있고, 한 문서 내에 여러개의 폼을 지정할 수도 있다. 더보기 * 블록레벨 요소와 인라인 요소 : https://developer.mozilla.org/ko/docs/Web/HTML/Block-..

디렉토리가 다음과 같이 되어있는 경우, home.css 에서 background-image url 로 이미지를 참조할때는 경로 앞에 "../"을 붙여야한다. ../ 이것은 기준 디렉토리의 상위 디렉토리를 의미한다. .home-image { position: relative; background-image: url("../img/olaf.jpg"); height: 100vh; /* Center and scale the image nicely */ background-position: center; background-repeat: no-repeat; background-size: cover; -webkit-align-items: center; align-items: center; -webkit-justif..

1. HTML 문서 내에서 2. HTML 문서 내에서 3. 하지만, (1) 코드가 길어지는 경우 (2) 동일한 스타일이나 자바스크립트를 다른 HTML 파일에도 적용하고 싶은 경우 이와 같은 경우에는 태그의 속성 (1) href : 연결할 곳의 주소 문서를 연결하는 a 태그이다. (2) rel : 현재 문서와 연결 문서의 관계를 표시 스타일시트로 연결하는 경우 - rel='stylesheet' 이런식으로 표기 그 밖에도 다른 속성값들이 있다. (3) type : 연결문서의 MIME 유형 (Multipurpose Internet Mail Extantions) 웹에서 내용 유형 (content type) 을 말할 때 자주 쓰인다. css -> text/css js -> text/javascript xml ->..