カスタム Web フォントを使用してデータ収集防止コードを実装する-PHPチュートリアル-php.cn

カスタム Web フォントを使用してデータ収集防止コードを実装する

PHPz

リリース： 2023-03-07 09:26:01

オリジナル

2631 人が閲覧しました

この記事では、新しい CSS3 機能の Web フォントの使用方法を紹介し、データ収集を防ぐためにカスタム Web フォントを使用します

Web フォントの概要

Web フォントは CSS3 のマークアップです @font-face では、@font-face 宣言でフォントを宣言し、フォントライブラリファイルをインターネット上の特定のアドレスからダウンロードするように指定できます。

具体的な書き方は以下の通りです:

@font-face {    font-family: &#39;字体名称&#39;;    src:  url(&#39;http://www.example.com/字体名称.eot&#39;); /* IE9 Compat Modes */
    src:  url(&#39;http://www.example.com/字体名称.eot?#iefix&#39;) format(&#39;embedded-opentype&#39;), /* IE6-IE8 */
    url(&#39;http://www.example.com/字体名称.ttf&#39;) format(&#39;truetype&#39;), /* Safari, Android, iOS */
    url(&#39;http://www.example.com/字体名称.woff&#39;) format(&#39;woff&#39;),  /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
    url(&#39;http://www.example.com/字体名称.svg?#字体名称&#39;) format(&#39;svg&#39;); /* Legacy iOS */}

ログイン後にコピー

Webページのデータを特殊なフォントで修正する必要がある場合、Webフォントを使用できます。 Web フォントを使用するとネットワークからフォントが自動的に読み込まれるため、ユーザーはマシンにフォントをインストールする必要はありません。

データ収集を防ぐためにカスタム Web フォントを使用します

収集防止の原則:
Web フォントを使用するとネットワークからフォントをロードできるため、自分でフォントのセットを作成し、カスタムのもの文字マッピング関係テーブル。
たとえば、0xaaa を設定すると文字 1 がマッピングされ、0xbbb は文字 2 がマッピングされます。
文字 1 を表示する必要がある場合、Web ページのソースコードは 0xaaa のみとなり、収集される内容も 1 ではなく 0xaaa のみとなるため、コレクターは正しいデータを収集できません。通常のアクセス権を持つユーザーには影響ありません。

中国語フォントのライブラリが大きすぎるため、中国語の収集を防ぐためにウェブフォントの方法を使用するのは適切ではありません。数字と英語の場合、この方法は収集を防止するのに適しています。

例: カスタム Web フォントを使用してデジタルデータ収集 (株式、映画興行収入データなど) を防止します

1. 指定した文字のカスタムフォントを作成します

最初に選択しますa font 。デモンストレーションの便宜上、システムに付属の Arial フォントを選択します。

ttf to svg

カスタム Web フォントを使用してデータ収集防止コードを実装する

everythingfonts.com/ttf-to-svg に移動します
ttf ファイルをアップロードし、フォントファイルを svg 形式に変換し、my_webfont.svg として保存します

使用したい文字を選択し、フォントマッピング関係を設定します

カスタム Web フォントを使用してデータ収集防止コードを実装する

icomoon.io/app/#/select と入力します
左上隅にあるアイコンのインポートボタンを選択し、my_webfont.svgをインポートします
インポート後、使用する文字を選択します。この例では、0-9を選択するだけで済み、右下隅にあるフォントの生成ボタンをクリックします

文字マッピングを設定
Arialフォント文字マッピング関係 (文字と 16 進数)

0 => 301 => 312 => 323 => 334 => 345 => 356 => 367 => 378 => 389 => 39

ログイン後にコピー

ここで変更します。マッピング関係は、推測を困難にするために、可能な限り複雑かつ不規則にすることができます。

たとえば、マッピング関係を

0 => e1f21 => efab2 => eba33 => ecfa4 => edfd5 => effa6 => ef3a7 => e6f58 => ecb29 => e8ae

ログイン後にコピー

カスタム Web フォントを使用してデータ収集防止コードを実装する

に設定し、マッピング関係に応じて名前を変更します。マッピング関係を設定した後、右下隅の download をクリックしてフォントをダウンロードします。

ダウンロードしたすべてのフォントファイルに my_webfont.* という名前を付けます

2. Web フォントを使用して Web ページにデータを表示します

まず @font-face

@font-face {    font-family: &#39;my_webfont&#39;;    src:  url(&#39;fonts/my_webfont.eot?fdipzone&#39;);    src:  url(&#39;fonts/my_webfont.eot?fdipzone#iefix&#39;) format(&#39;embedded-opentype&#39;),    url(&#39;fonts/my_webfont.ttf?fdipzone&#39;) format(&#39;truetype&#39;),    url(&#39;fonts/my_webfont.woff?fdipzone&#39;) format(&#39;woff&#39;),    url(&#39;fonts/my_webfont.svg?fdipzone#my_webfont&#39;) format(&#39;svg&#39;);}

ログイン後にコピー

を設定する必要があります

CSS クラスとフォントファミリーはこの Web フォント

.my_webfont{    font-family: my_webfont !important;    -webkit-font-smoothing: antialiased;    -moz-osx-font-smoothing: grayscale;}

ログイン後にコピー

を使用して、この種のデータを表示する必要があるデータを入力します。コンテナのクラスは my_webfont

<p class="my_webfont">&#xefab</p>

ログイン後にコピー

として定義されているため、文字1を表示することができます。

3. 完全なサンプルコード

<?php// 字体映射关系function get_font_num($num){
    $result = &#39;&#39;;    $font_map = array(        0 => &#39;e1f2&#39;,        1 => &#39;efab&#39;,        2 => &#39;eba3&#39;,        3 => &#39;ecfa&#39;,        4 => &#39;edfd&#39;,        5 => &#39;effa&#39;,        6 => &#39;ef3a&#39;,        7 => &#39;e6f5&#39;,        8 => &#39;ecb2&#39;,        9 => &#39;e8ae&#39;
    );    for($i=0,$len=strlen($num); $i<$len; $i++){        $n = substr($num, $i, 1);        if(is_numeric($n)){            $result .= &#39;&#x&#39;.$font_map[$n].&#39;;&#39;;
        }else{            $result .= $n;
        }
    }    return $result;
}$data = array(    array(&#39;金刚：骷髅岛&#39;, 4921.98, 5),    array(&#39;美女与野兽&#39;, 971.36, 12),    array(&#39;欢乐喜剧人&#39;, 590.27, 5),    array(&#39;一条狗的使命&#39;, 389.76, 26),    array(&#39;领袖1935&#39;, 271.27, 1),
);?><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html>
 <head>
  <meta http-equiv="content-type" content="text/html;charset=utf-8">
  <title>利用自定义web-font实现数据防采集</title>
  <style type="text/css">
    @font-face {        font-family: &#39;my_webfont&#39;;        src:  url(&#39;fonts/my_webfont.eot?fdipzone&#39;);        src:  url(&#39;fonts/my_webfont.eot?fdipzone#iefix&#39;) format(&#39;embedded-opentype&#39;),        url(&#39;fonts/my_webfont.ttf?fdipzone&#39;) format(&#39;truetype&#39;),        url(&#39;fonts/my_webfont.woff?fdipzone&#39;) format(&#39;woff&#39;),        url(&#39;fonts/my_webfont.svg?fdipzone#my_webfont&#39;) format(&#39;svg&#39;);        font-weight: normal;        font-style: normal;    }

    .my_webfont{        font-family: my_webfont !important;        -webkit-font-smoothing: antialiased;        -moz-osx-font-smoothing: grayscale;    }

    td{        padding: 0px 5px 0px 5px;        text-align: center;    }

    .left{        text-align: left;    }

  </style>
 </head>

 <body>
  <table>
    <tr>
        <td>排名</td>
        <td>片名</td>
        <td>实时票房(万)</td>
        <td>上映天数</td>
    </tr><?php
    for($i=0,$len=count($data); $i<$len; $i++){        echo &#39;<tr>&#39;.PHP_EOL;        echo &#39;<td>&#39;.($i+1).&#39;</td>&#39;.PHP_EOL;        echo &#39;<td class="left">&#39;.$data[$i][0].&#39;</td>&#39;.PHP_EOL;        echo &#39;<td class="my_webfont">&#39;.get_font_num($data[$i][1]).&#39;</td>&#39;.PHP_EOL;        echo &#39;<td class="my_webfont">&#39;.get_font_num($data[$i][2]).&#39;天</td>&#39;.PHP_EOL;        echo &#39;</tr>&#39;.PHP_EOL;
    }?>
  </table>
 </body></html>

ログイン後にコピー

ブラウザでアクセスすると通常のデータが表示されます

カスタム Web フォントを使用してデータ収集防止コードを実装する

しかし、HTMLソースコードは実際には

<tr><td>1</td><td class="left">金刚：骷髅岛</td><td class="my_webfont">&#xedfd;&#xe8ae;&#xeba3;&#xefab;.&#xe8ae;&#xecb2;</td><td class="my_webfont">&#xeffa;天</td></tr>

ログイン後にコピー

カスタム Web フォントを使用してデータ収集防止コードを実装する

によってのみ取得できますコレクター edfd; に類似したデータは、 edfd; がどの文字にマップされているかを知ることができないため、データ収集ができません。

もちろん、収集者は分析を通じて各マッピングの意味を知り、収集後の変換処理を実行できます。
複数の異なるフォントファイルとマッピングテーブルを作成できます。訪問ごとに 1 つのタイプがランダムに使用され、フォントファイルとマッピングテーブルのバッチが定期的に更新されて収集の難易度が高まります。
このように、コレクターはデータを収集する前にすべてのフォントファイルとマッピングテーブルを分析して変換する必要があり、収集コストが大幅に増加します。

以上がカスタム Web フォントを使用してデータ収集防止コードを実装するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。