Javascript & JavaScript Application PHP 로 css/js 보호하기

2019.11.08 13:04

졸리운_곰 조회 수:439

PHP 로 css/js 보호하기

 

업무상 내가 작성한 디자인이 복사되는걸 막으셔야 하는 front-end 개발자/웹디자이너 분들 위해 아래 방법을 소개시켜드립니다. 죄송합니다. 이글을 빨리 쓰지 못했어서.. ㅠㅠㅠㅠ

방법 1. css/js 에 비밀번호를 다는 방식

일단 index.php 페이지에 css비번을 달아 줍니다. 이런식으로

1
2
3
4
5
6
7
8
9
10
11
12
13
<?php
session_start();
$_SESSION['csskey'] = "비밀번호";
?>
 
<html>
    <head>
        <link rel="stylesheet" type="text/css" href="style.css" />
    </head>
    <body>
        내용.....
    </body>
</html>

그리고 이제 style.css (워드프레스는 css 명이 style.css 니까) 를 style.php 로 바꿔줍니다. 이렇게.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<?php
session_start();
header("Content-type: text/css");
 
if ($_SESSION["csskey"] != "비밀번호") { //만약 session css 비번이 동일하지 않으면
    die("Protected"); // 뒤져
}
 
$_SESSION["csskey"] = "번호확인됨"; // 비번이 맞으면 허락/재사용
?>
 
/* 사이트 css 내용 */
body {}
h1 {}
.....

마지막으로 예전에 알려드렸던 하위폴더 암호화 하는 방식을 응용해서.. 끙… 제가 쓴글을 제가 못찾겠네요. >. 아파치라면 Rewrite rule 을 .htaccess 에 하나 작성해 줍니다.

RewriteEngine on
RewriteRule style.css style.php

Nginx 라면 이렇게 하시면 되겠죠?

1
2
3
location / {
rewrite style.css /style.php;
}

javascript 도 동일한 방식으로 하시면 됩니다.

방법 2. 내 사이트에서만 css 작동되게 하기

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
header("Content-type: text/css");
  
$allowed_servers = array('http://hackya.com'); // 본인 사이트 로 바꾸세요
  
$status_array = array();
if (!empty($_SERVER['HTTP_REFERER'])) // array 값이 맞으면
{
    foreach($allowed_servers as $server)
    {
        if (contains($server, $_SERVER['HTTP_REFERER']))
        {
            $status_array[] = 'ok';
        }
    }
}
  
if (!in_array('ok', $status_array)) // 만약 array 값이 맞지 않으면
{
    print "
        body { display: none !important; } //감춤
    ";
    exit;
}
  
$core_files = array('style.css');
foreach($core_files as $file)
{
    // get the contents
    print file_get_contents(dirname(__FILE__) . '/' . $file) . "\n";
}
  
/**
* substring 값이 있는지 확인
* substring 값이 동일한지 확인
* 맞으면 ok
**/
function contains($needle, $haystack)
{
    if (empty($needle)) { return false; }
    $pos = strpos($haystack, $needle);
    if($pos === false) { return false; }
    else { return true; }
}

1번 방식과 2번 방식을 겸용사용하실 필요는 없습니다. 둘중 하나만 하셔도 됩니다.

이렇게 해놓으면 빨대족들은 이런 개소리를 하겠죠.

우헤헤 css/js 개별페이지 안봐도 되는데? 개발자 console 열면 css 다 보이는데? 거기서 한줄 한줄 베끼면 되는데?

네, 이제 개발자 console 이 열리지 않게 하거나, 개발자 console 을 열면 아무것도 보이지 않게 하는 작업을 해야 합니다. 에고… 에고… 힘드시죠? ㅠㅠ

작년까지도 Paul Irish 가 공개한 이 방법이 작동 되었었는데…

1
2
3
4
5
6
7
function isInspectOpen()
{
    console.profile();
    console.profileEnd();
    if (console.clear) console.clear();
    return console.profiles.length > 0;
}

이게, console.profiles 가 없어지면서 작동이 멈췄습니다.
그래서 이 부분이 해결이 안되서 제가 계속 이 글을 못 쓰고 있었는데, 좋은 방법을 어느 분이 공개해 주셨습니다.

경축! 아무것도 안하여 에스천사게임즈가 새로운 모습으로 재오픈 하였습니다.
어린이용이며, 설치가 필요없는 브라우저 게임입니다.
https://s1004games.com

일단 아래 페이지 방문하셔서 console 창을 열어보세요. 콘솔창을 따로 띄워도 보시구요. 파폭, 크롬, IE, 어느 경우에도 console 창이 열리거나 보이면 detect 을 해 냅니다.

https://jsfiddle.net/evnrorea/embedded/result/

https://github.com/zswang/jdetects 여기 git에서 미리 만들어 져있는 예제 다운받으셔서 쓰시면 됩니다.

*그냥 F12 key 비활성화 시키면 되잖아? 라고 생각드시는 분들이 계실수도 있는데, F12 key 없다고 개발자 console 못 여는 것 아닙니다. 마우스는 폼으로 있는게 아니죠.ㅋㅋㅋㅋㅋ

마지막으로, 우헤헤 자스 끄고 들어가면 console 창 열수 있는데? 이소리 또 하겠죠?

1
2
3
4
<noscript>
  <style>html{display:none;}</style>
  <meta http-equiv="refresh" content="0.0;url=미성년자도 볼수 있어 차마 미트스핀 주소는 못넣겠네요">
</noscript>

자스 끄고 사이트 들어오면 redirect 해서 미트스핀 같은 곳으로 관광 보내버리면 됩니다.

이정도면 어떤 방식으로도 css 나 js 를 빨대족이 베껴갈 수 없습니다. 물론 복사기 돌려도 무용지물이죠.

나중에, 진짜 나중에 시간날때,

1. 내 사이트 에서 복사기 돌리는 것 방지하기
2. 복사기 돌리는 빨대족들 응징하기 (복사기 돌리는 인간 컴퓨터 악성코드로 감염시켜서 그 인간 PC 하드웨어 까지 복구불능으로 만드는 방법)

에 대한 글을 써보겠습니다.

 

 

[

 

본 웹사이트는 광고를 포함하고 있습니다.
광고 클릭에서 발생하는 수익금은 모두 웹사이트 서버의 유지 및 관리, 그리고 기술 콘텐츠 향상을 위해 쓰여집니다.
이 게시물을
목록
목록
쓰기
태그
대표 김성준 주소 : 경기 용인 분당수지 U타워 등록번호 : 142-07-27414
통신판매업 신고 : 제2012-용인수지-0185호 출판업 신고 : 수지구청 제 123호 개인정보보호최고책임자 : 김성준 sjkim70@stechstar.com
대표전화 : 010-4589-2193 [fax] 02-6280-1294 COPYRIGHT(C) stechstar.com ALL RIGHTS RESERVED