banana like sunshine RSS FEED

SSH를 이용해서 접속한 상태에서 업그레이드를 위해서 

do-release-upgrade

을 실행시키면 screen session이 시작되면서 겁나는(?) 경고 문구가 나옵니다. 

내용은.. SSH로 접속한 상태에서 실행하면 문제가 발생할 수 있고 최악의 경우 서버가 맛이 갈 수 있다는 내용이 나오는데요.

포스팅 하면서 아 이거 써야지 하고 해보니 안뜨는군요. :-)

하여튼 업그레이드 과정 중에 SSH 접속이 끊겨버리고, 그 상태에서 SSH 접속이 막혀버리면 어떻게 손쓸 방법이 없어지기 때문에 나오는 경고입니다. 물론 한밤중에 IDC나 사무실로 뛰어가서 터미널에서 복구를 해야하는 사태를 미연에 방지해주기 위한 배려라고 생각하고 좋게 넘어가야 겠지요. 

하필이면 업그레이드 하는 중에 SSH가 끊기는 사태는 거의 없겠지만, 구글링을 해보다 보면 마음에 걸리는 경우가 하나 있더군요. 다름 아니라 SSH 자체가 업그레이드 되는 경우이지요. 

뭐 아직까지는 심각한 문제가 발생해 본 적이 없어서 그냥 기우라 생각하기는 하지만, 혹시 몰라서 처음에 뜨는 경고창에서 지정해주는 포트로 보조로 접속은 항상 해놓습니다. 이 보조 포트는 평소에는 deny지만, 이 경우에만 접속을 허용해줍니다. 업그레이드를 하는 도중에 SSH 창에 사고가 발생해도 최소한 복구는 가능하게 해주는 거지요. 제 서버는 1022 포트로 접속하라고 하니.. 아래와 같이 해주면 됩니다.

ssh -p 1022 {id}@{hostname.com}

bootstrap을 기반으로 웹앱을 만들 때 가장 문제가 되는 것은 역시 IE에서 호환성 문제입니다. 

많이 해결도 되었고, IE 구버전 이용자가 점점 줄어드는 영향도 있고 하지만,아직도 IE8 이용자가 제가 관리하는 사이트에서는 15% 정도가 되다 보니 무시할 수도 없는 노릇입니다. ㅡ.ㅡ

하여튼 bootstrap3 에서는 IE 구버전에서도 룩을 유지하기 위해서 다음과 같이 처리합니다 :

하지만 이상하게 잘 먹히지를 않더군요;;

이유를 찾아보니 respond.js 는 로컬에서만 제대로 작동을 하기 때문에 위와 같이 CDN에서 읽어오면 안되는 이유였습니다. 

왜냐하면 이 respond.js 내부에서 CSS를 외부에서 AJAX로 불러와서 쓰는데.. 이때 cross-domain 이슈가 발생하기 때문입니다.

간단하게 해결하려면, 해당 파일을 로컬에 카피해서 이용하시거나.. 개발진 git에서 볼 수 있듯이 proxy를 이용해야 합니다. 

참고 :  https://github.com/scottjehl/Respond#cdnx-domain-setup 

검색엔진 최적화에서 가장 중요한 것 중 하나가 원본 데이터에 대한 정보를 검색로봇에 알려주는 것인데, 몇 년전에 대형 검색엔진들이 검색 결과에서 중복된 값들을 삭제하기로 한 이후로 중요성을 띄게 된 태그가 이 CANONICAL 입니다.

canonical link는 다음과 같이 정의합니다 :

<link rel="canonical" href="http://sample.com/index.php" />

이는 여러 가지 이유로 인해 원본 문서와 동일한 복사된 문서가 존재할 경우에, 검색엔진에 원본문서를 알려주는 역할을 합니다. 그렇다면 보통(!)의 경우 언제 필요한 걸까요?

1. 지저분한 url 값의 정리

구글에서 사이트 검색을 해보면 이런 값들이 심심치 않게 보입니다. 

sampledomain.com/index.php?PHPSESSID=3a98ad5ee8b0923ac868dc7e891ec154

이런 경우야 별 거 아니지만, 인수값에 page, category, search값 등 온갖 값들이 다 붙은 채로 인덱싱이 되어 있는 경우에는 문제가 생길 수가 있겠습니다. 

2. url이 변경될 때

이 경우가 더 중요하겠지요. 사이트 수정보완하면서 url이 변경되는 경우가 많습니다. 이 경우 이전 url로 들어오는 트래픽을 redirect 시켜주어야 하는데, 이때 원본 문서의 값을 검색엔진에 알려주어야 합니다. 

3. https 이용할 경우

이 경우에는 당연히 보안 적용된 url과 보안 적용이 안된 url이 다르겠지요. 특히 호스팅 업체에 따라서는 포트 번호 등이 추가됨에 따라서 같은 컨텐츠라도 다르게 인식이 될 수 있습니다. 

이런 경우에는 canonical link를 걸어주는 것이 바람직하다고 봅니다. 

다음은 적용시 주의해야 할 사항들에 대한 정리입니다 :

• rel = canonical 로 지정한 타겟 url이 실제로 존재하는지 확인해야 합니다(실제로 개발하다 보면 빼먹기 쉬운 경우입니다). 당연히 검색 결과를 없는 페이지로 돌려버리면 큰 일 나겠지요;;

• 위와 같은 경우이겠지만, 원본 문서가 있는 디렉토리의 robot.txt 설정이 검색 로봇의 인덱싱을 허용해 주어야 합니다.

• 원본 문서에는 해당 페이지의 문서가 포함되어 있어야 합니다. 당연한 얘기이겠지만, 여러 페이지로 나누어져 있는 문서를 하나의 canonical link로(예를 들어 첫 페이지로) 묶는 오류도 가끔 볼 수 있는데, 이 경우에는 원하는 SEO결과를  기대할 수 없습니다. 검색엔진의 입장에서는 각각의 페이지가 다른 문서이기 때문이지요. 굳이 여러 페이지로 나누어진 문서에 대해서 하나의 canonical link를 정해주려면 모든 페이지를 포함하는 마스터 문서를 하나 만든 후에 여기로 링크를 해주는 것은 도움이 될 것 같습니다.

• HEAD에 들어가야 합니다. google webmastser에서는 명식적으로 BODY에 들어가는 canonical link는 고려하지 않는다고 하고 있습니다. 아울러 가능하면 HEAD 안에서도 앞쪽에서 지정하라고도 되어 있습니다.

에디터를 이용하지 않는 게시물의 파일 관리를 위해서 그누보드에서는 g5_board_file 이라는 테이블을 운영하고 있습니다.

common.lib.php에 있는 

get_list 함수가 전역변수인 $view를 생성하는 과정에서

get_file 함수에서 읽어와서 $file 어레이를 리턴해 주도록 되어 있습니다. 

굳이 개발을 front-end와 back-end로 나누자면, 계속 back-end 작업만 하다 요새 와서는 UI다 뭐다 이용자(보는 사람)에게 맞추어야 하겠다는 생각을 많이 하게 된다.

처음에 개발하면서 팁들을 조금씩 정리해야지 할 때만 해도.. 본문에 그냥 넣고 내버려뒀더니 주인장조차 눈에 잘 들어오지 않으니, 고민하다 결국 syntax highlighter로 이용자들에게 서비스를 결심하기에 이른다. ㅡ.ㅡ

이번 포스팅은 syntax highlighter 정리이다. 사실 다운로드 받아서 설치해주면 제일 좋다. 내 서버가 있으면야 좋고 나는 관리하기 귀찮아서 안한다는 건 별개의 얘기 티스토리처럼 셋방살이(!)를 하는 경우에는 거기에 맞는 솔루션이 있다. 티스토리에 설치하는 데 대한 포스팅은 다른 분들의 블로그에도 많으니 패스하고 여기에서는 CDN 서비스하는 서버에서 살짝 불러오는 방법이다.

1. 설치

이렇게 header에 넣어주면 된다.

1행 ~ 5행이 필요한 css와 javascript를 불러오는데, 본인이 필요한 syntax 파일을 정의하는 곳이 4행이다. 요새 작업하는게 php라 일단 php 문법을(Brush라고 부름) 불러왔다. 필요에 따라 javascript, css, python, C# 등의 브러시를 추가해주면 된다. 각 브러시의 명칭은 다음을 참고하면 된다 : http://alexgorbatchev.com/SyntaxHighlighter/manual/brushes/

가령 javascript 코드라면 shBrashJScript.js를 포함해주면 된다.

단, 이 프로젝트를 개발하고 계속 유지해주는 친절한 고르바초프 씨(!)는 이렇게 서비스를 이용해주시는 사람들 때문에 아마존에서 트래픽이 한 달에 83G에 달한다고 한다. 돈 많이 버는 이용자들은 donation을, 그렇지 않으면 가끔 들어갈 때마다 배너 클릭 한번씩 해드리는 것이 감사를 표하는 예의가 아닐지.. ^^

2. 이용 방법

이용방법은 단순하다.

<pre> element의 class를 다음과 같이 정의한다 : 

<pre class = "brush: php">

// 넣고 싶은 code 삽입 ...

</pre>

여기에서 brush는 필요한 것으로 정의하면 된다. javascript라면 js, Java면 java 이런 식이다. 이것도 여기를 보시면 된다.