Pure CSS img slider 슬라이드 기능을 CSS만으로 만들수있습니다. 다만 모바일 드래그등의 기능을 추가하려면 JS의 도움이 필요합니다. 드래그로 전환 기능을 제외한 왼쪽() 버튼과 하단의 위치등은 CSS로 기능까지 구현이 가능합니다. 여기에는 +,~와 같은 CSS선택자가 이용됩니다. +활용 .class:checked + label{ display:block; } ~활용 .class:checked ~ label{ display:block; } 차이로는 +는 하나만 선택하고 ~는 형제를 모두 선택할수있습니다. 이 코드의 원리분석은 매우 간단합니다. 코드가 굉장히 짧거든요 게다가 지금도 문제없이 작동하는 7년전 코드입니다. html의 radio를 이용해서 현재 위치를 체크하고, radio가 체크된경우에 따라 label(여러 버튼)을..
썸네일 이미지
CSS content 깨지는 현상(주의점) CSS content는 좋은 기능이다. :after 이나 :before 등에서 사용가능하며 HTML또는 JS없이도 글을 작성가능한 기능이다. 다만 이걸로 글을 쓰기에는 SEO에는 부적절하다. 그런데, 이 content는 영어+숫자가 아닌 일반기호, 한글등은 가끔 깨진다. ">" 같이 일반적으로 사용하는 기호도 새로고침 여러번 하다보면 가끔씩 깨진다. 이런 버그가 있어서 CSS를 작성시 유니코드문자로 작성할 수 있으며, 이렇게 작성해야 안깨진다. 그냥써도 거의 대부분(99% 이상)에서 안깨지지만 아주 가끔(1% 미만) 깨질수있다. 문자로 작성한 글은 div#main>div.input:after{ content: '또는 클릭해서 파일을 선택하실 수 있습니다.'; } 아래와 같이 유니코드로 변환해주는게 좋다...
썸네일 이미지
네이버 상단 웨일 광고 제거하기 네이버 상단에는 웨일 광고가 항상 뜹니다. 3일마다 뜨도록 설정되어있어 저는 가끔 들어가는데도 매일 보이는것 같아 싫었습니다. 애드블록으로 차단해왔으나 네이버는 랜덤 Class명을 부여함으로 애드블록을 무력화시켰습니다. 구글과 네이버에 검색해보니 저와 같은 방법의 글은 없었습니다. 이 블로그의 글은 무단 복제/전재를 금지하며, 링크공유만 허용됩니다. 작동원리 네이버의 상단 웨일광고는 쿠키를 이용해 3일간 안뜨게 만듭니다. 쿠키의 이름은 NM_TOP_PROMOTION입니다. 3일동안 보지 않기를 누르는 경우 쿠키에 값은 1이 들어가고, expires로 보존기한 3일을 설정합니다. 따라서 자바스크립트로 기한을 100년동안 안보이게 설정했습니다. document.cookie="NM_TOP_PROMOTION=1..
완전한 삭제는 불가하다 - 개인정보 보호 서버와 데이터에 대해 글을 써보고 싶어서 이 글을 쓰게 되었습니다. 블로그에 글을 쓰고 지우던, 영상을 올리고 지우던, 스트리밍 데이터던 100% 삭제됨을 보장할 수 없습니다. 내 손을 떠난 데이터고, 회사들은 삭제라고 부르지만 복원용 서버에 삭제하려던 데이터들이 남아있을 수 있습니다. 물론 외부에 공개되지는 않지만, 회사 내부 서버에 존재 가능함을 말하고 싶은 것입니다. 우리가 쉽게 쓰는 컴퓨터나 휴대폰에서도 휴지통 같은 기능이 있습니다. 이 휴지통은 삭제가 아닌 별도의 저장 위치일 뿐입니다. 다시 복구가 가능하지만 원래 위치에는 없으므로 파일이 휴지통에 있을 때는 정상적으로 불러올 수 없습니다. 서버에서도 마찬가지로 대부분의 경우 휴지통과 같은 시스템이 동작합니다. 완전 삭제를 방지하는 장치가 서비스..
썸네일 이미지
SameSite 쿠키 정책 구글 크롬(Chrome) 80버전부터 SameSite 정책이 시행되었습니다. 개발자 도구를 열어보면 다른 리소스(루트도메인이 다른경우)로부터 전달받는 쿠키를 앞으로는 사용할 수 없다고 안내합니다. A cookie associated with a cross-site resource at http://daum.net/ was set without the `SameSite` attribute. A future release of Chrome will only deliver cookies with cross-site requests if they are set with `SameSite=None` and `Secure`. You can review cookies in developer tools under Ap..
HTML) Link, Script 태그 integrity 옵션 integrity 라는 옵션도 있다. 태그나 특정 버전의 파일이 변경되거나 변조된 경우 막을 수 있다. 이를 이용해 악의적인 스크립트 변조를 막을수도 있다. 지원하는 해시는 sha256 sha384 sha512이며 이 옵션은 IE는 적용되지 않습니다. 요즘 많은 웹사이트에서 CDN을 사용하나, 만약 CDN보안이 뚫리거나 CDN내용을 변조한다면(게시자의 코드수정 포함), CDN을 사용하는 모든 웹사이트에 아래 예시와 같은 공격을 할 수 있을겁니다. (예) CDN의 JS내용을 변조하여 접속한 사이트의 정보를 탈취(XSS방지가 대부분되어있으므로 최신 브라우저에서는 안됨) 또는 악성 스크립트 실행(크립토재킹, 악성사이트로 리다이렉트, 피싱사이트로 리다이렉트 등) CDN이 뚫릴일은 희박하지만 보안은 가능성이 0%..
썸네일 이미지
도메인 CAA 적용방법 도메인을 등록한 DNS서버 관리 페이지로 이동합니다. DNS서버 관리 페이지는 아래와 같은 업체들이 있습니다. 도메인 구입한 사이트 클라우드 플레어 구글 도메인 DNSZi 무료 DNS 등 이 중 일부는 지원이 안됩니다. 글 작성일(2020-06-15)기준 DNSZi 불가, 클라우드 플레어 가능 클라우드 플레어가 가능하기 때문에 클라우드 플레어로 설명드리겠습니다. 관리페이지로 접속 후 CAA를 선택합니다. 다음과 같이 입력했습니다. (도메인은 가렸습니다.) CA 도메인에는 인증서 발급 도메인을 작성할 수 있습니다. Tag 설정에는 몇가지 값이 있는데 Only allow specific hostnames : CAA의 issue 값입니다. Only allow wildcards : CAA의 issuewild 값..
PHP8 JIT 업데이트후 차이 예상은? PHP8이 2021년쯤 나올 예정입니다. JIT 컴파일러를 내장할것으로 발표되어 많은 PHP 개발자가 기대를 하고있습니다. 지금 PHP7의 속도도 충분히 올라와서 실제 서비스를 처리하는데 큰 문제없습니다. PHP에 JIT(Just In Time)이 달리면 얼마나 빨라질까요? JIT(Just In Time)이 필요한 이유 기존의 PHP에는 String을 불러와서 스크립트를 해석하고 실행했습니다. 당연히 실행마다 해석하니 실행에 시간이 더 걸렸죠.. 그래서 실행을 한번하면 임시 저장하여 다시 실행할때 속도를 높이는 opcache같은 플러그인이 있었습니다. 다만, 호환문제로 오류가 나는 경우도 있었습니다. JIT은 String을 재해석하는게 아닌 컴퓨터가 더 빠르게 실행할수있는 Byte코드로 변환해두어 실행하..