Table of Contents
Use custom web-font to prevent data collection
Example: Use custom web-font to prevent digital data collection (such as stocks, movie box office and other data)
1. Create a custom font of specified characters" >1. Create a custom font of specified characters
2. Use web-font in web pages Display data" >2. Use web-font in web pages Display data
3. Complete example code" >3. Complete example code
Home Backend Development PHP Tutorial Use custom web-font to implement data collection prevention code

Use custom web-font to implement data collection prevention code

Apr 03, 2017 pm 04:26 PM

This article introduces the use of the new CSS3 feature web-font, and uses custom web-font to prevent data collection

Introduction to web-font

web-font is a tag @font-face in CSS3. In the @font-face declaration, you can declare a font and specify this The font library file is downloaded from a certain address on the Internet.

The specific writing method is as follows:

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

When web page data needs to be modified with a special font, we can use web-font. Because using web-font will automatically load the font from the network, the user does not need to have the font installed on the machine.

Use custom web-font to prevent data collection

Prevention principle:
Use web-font to load fonts from the network, so we can create a set of fonts ourselves and set up a custom character mapping table.
For example, set 0xaaa to map character 1, 0xbbb to map character 2, and so on.
When the character 1 needs to be displayed, the source code of the web page will only be 0xaaa, and the collected data will only be 0xaaa, not 1, so that the collector cannot collect correct data. There is no impact on users with normal access.

It is not suitable to use the web-font method to prevent Chinese collection, because the Chinese font library is too large. For numbers and English, this method is suitable for preventing collection.

Example: Use custom web-font to prevent digital data collection (such as stocks, movie box office and other data)

1. Create a custom font of specified characters

First select a font. For convenience of demonstration, select the Arial font that comes with the system.

ttf to svg

Use custom web-font to implement data collection prevention code

Enter everythingfonts.com/ttf-to-svg
Upload the ttf file and convert the font file Convert to svg format and save as my_webfont.svg

Select the characters to be used and set the font mapping relationship

Use custom web-font to implement data collection prevention code

Enter icomoon.io/app/#/select
Select the Import Icons button in the upper left corner and import my_webfont.svg
After importing, select the characters we want to use. In this example, we only need to select 0-9, and then click the lower right corner Generate Font Button

Set character mapping
Arial font character mapping relationship (characters and hexadecimal)

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

We modify it here The mapping relationship can be as complex and irregular as possible to make it difficult to guess.

For example, set the mapping relationship to

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

Use custom web-font to implement data collection prevention code

and modify the name according to the mapping relationship. After setting the mapping relationship, click the lower right corner downloadDownload font.

Name all downloaded font files as my_webfont.*

2. Use web-font in web pages Display data

First you need to set @font-face

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

Then you need to define a css class, font-family uses this web-font

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

Where this kind of data needs to be displayed, fill in the data, and the class of the container is defined as my_webfont

<p class="my_webfont">&#xefab</p>
Copy after login

so that the character 1 can be displayed.

3. Complete example code

<?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>
Copy after login

You can see normal data when accessed in the browser

Use custom web-font to implement data collection prevention code

But the html source code is actually

<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>
Copy after login

Use custom web-font to implement data collection prevention code

The collector can only get something like edfd; data cannot know what characters are mapped by edfd;, thus preventing data collection.

Of course, the collector can know the meaning of each mapping through analysis, so as to perform post-collection conversion processing.
We can create multiple different font files and mapping tables. Each visit randomly uses one type, and regularly updates a batch of font files and mapping tables to increase the difficulty of collection.
In this way, the collector needs to analyze and convert all font files and mapping tables before collecting data, which will greatly increase the cost of collection.

The above is the detailed content of Use custom web-font to implement data collection prevention code. For more information, please follow other related articles on the PHP Chinese website!

Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Tools

Notepad++7.3.1

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

SublimeText3 Mac version

God-level code editing software (SublimeText3)

How does session hijacking work and how can you mitigate it in PHP? How does session hijacking work and how can you mitigate it in PHP? Apr 06, 2025 am 12:02 AM

Session hijacking can be achieved through the following steps: 1. Obtain the session ID, 2. Use the session ID, 3. Keep the session active. The methods to prevent session hijacking in PHP include: 1. Use the session_regenerate_id() function to regenerate the session ID, 2. Store session data through the database, 3. Ensure that all session data is transmitted through HTTPS.

Explain JSON Web Tokens (JWT) and their use case in PHP APIs. Explain JSON Web Tokens (JWT) and their use case in PHP APIs. Apr 05, 2025 am 12:04 AM

JWT is an open standard based on JSON, used to securely transmit information between parties, mainly for identity authentication and information exchange. 1. JWT consists of three parts: Header, Payload and Signature. 2. The working principle of JWT includes three steps: generating JWT, verifying JWT and parsing Payload. 3. When using JWT for authentication in PHP, JWT can be generated and verified, and user role and permission information can be included in advanced usage. 4. Common errors include signature verification failure, token expiration, and payload oversized. Debugging skills include using debugging tools and logging. 5. Performance optimization and best practices include using appropriate signature algorithms, setting validity periods reasonably,

Describe the SOLID principles and how they apply to PHP development. Describe the SOLID principles and how they apply to PHP development. Apr 03, 2025 am 12:04 AM

The application of SOLID principle in PHP development includes: 1. Single responsibility principle (SRP): Each class is responsible for only one function. 2. Open and close principle (OCP): Changes are achieved through extension rather than modification. 3. Lisch's Substitution Principle (LSP): Subclasses can replace base classes without affecting program accuracy. 4. Interface isolation principle (ISP): Use fine-grained interfaces to avoid dependencies and unused methods. 5. Dependency inversion principle (DIP): High and low-level modules rely on abstraction and are implemented through dependency injection.

How to debug CLI mode in PHPStorm? How to debug CLI mode in PHPStorm? Apr 01, 2025 pm 02:57 PM

How to debug CLI mode in PHPStorm? When developing with PHPStorm, sometimes we need to debug PHP in command line interface (CLI) mode...

How to automatically set permissions of unixsocket after system restart? How to automatically set permissions of unixsocket after system restart? Mar 31, 2025 pm 11:54 PM

How to automatically set the permissions of unixsocket after the system restarts. Every time the system restarts, we need to execute the following command to modify the permissions of unixsocket: sudo...

Explain late static binding in PHP (static::). Explain late static binding in PHP (static::). Apr 03, 2025 am 12:04 AM

Static binding (static::) implements late static binding (LSB) in PHP, allowing calling classes to be referenced in static contexts rather than defining classes. 1) The parsing process is performed at runtime, 2) Look up the call class in the inheritance relationship, 3) It may bring performance overhead.

How to send a POST request containing JSON data using PHP's cURL library? How to send a POST request containing JSON data using PHP's cURL library? Apr 01, 2025 pm 03:12 PM

Sending JSON data using PHP's cURL library In PHP development, it is often necessary to interact with external APIs. One of the common ways is to use cURL library to send POST�...

See all articles