JavaScript code examples for desensitization of personal information (mobile phone number, ID number, name, email) in the front-end

Preface

In today's digital age, the security and privacy protection of personal information have become the focus of public attention. This article will use JavaScript code examples to demonstrate how to desensitize personal data such as mobile phone number, ID number, name, email address, etc. Ensure that the needs are met while protecting users' privacy.

1. Mobile phone number

Mobile phone number desensitization usually retains the first three and the last four digits, and the middle four digits are replaced by an asterisk. Match the structure of the mobile phone number through regular expressions, and capture the first three and the last four digits using groupings, and replace the middle four digits with the asterisk.

phoneHide(phone) {
	let reg = /^(1[3-9][0-9])\d{4}(\d{4}$)/; // Define the regular expression of the mobile phone number	phone = (reg, '$1****$2');
	return phone;
}

Use regular expressions to desensitize mobile phone numbers

2. ID number

Desensitizing an ID number usually means retaining the first and last digits of the ID number, and replacing the middle part with an asterisk.

function desensitizeIDCard(idCard) {
  if (!idCard ||  < 6) {
    ('Please enter a valid ID number');
    return '';
  }

  // The ID number in mainland China is 18 digits long  const idLength = 18;
  // Keep the first 6 and the last 4 digits, and replace the middle with asterisk  const prefix = (0, 6);
  const suffix = (idLength - 4);
  const middle = '*'.repeat(idLength - 10);

  return prefix + middle + suffix;
}
// Example(desensitizeIDCard('123456199001010012')); // Output: 123456*********0012

3. Name

Desensitizing name data usually means replacing a portion of the name with an asterisk (*) or other placeholder to protect personal privacy.

function desensitizeName(name, options) {
  // Default desensitization option  const defaultOptions = {
    showFirstLetter: true,  // Whether to display the first letter    starLength: 3           // The length of the desensitized character  };

  // Merge user options and default options  const settings = {...defaultOptions, ...options};

  // Check whether it is a Chinese name  const isChineseName = /[\u4e00-\u9fa5]/.test(name);

  // Desensitization function  const desensitize = (str) => {
    const firstLetter = str[0];
    const restLength =  - 1;
    const stars =  ? '*'.repeat(restLength) : '*'.repeat();
    return firstLetter + stars;
  };

  if (isChineseName) {
    // Suppose the Chinese name consists of two or three characters    return desensitize(name);
  } else {
    // English names may consist of multiple words    const parts = (' ');
    const desensitizedParts = (part => desensitize(part));
    return (' ');
  }
}

// Example(desensitizeName('Zhang San', { showFirstLetter: true, starLength: 2 })); // Output: Zhang **(desensitizeName('Li Si', { showFirstLetter: false })); // Output: ***(desensitizeName('John Doe', { showFirstLetter: true, starLength: 2 })); // Output: J*** D**

This function accepts a name string and an option object. An option object can contain two properties:showFirstLetterDecide whether to display the first letter of the name,starLengthDetermines the number of asterisks displayed after desensitization. The function desensitizes Chinese or English names based on these options.

Note that this function assumes that a Chinese name consists of two or three Chinese characters, while an English name consists of multiple words separated by spaces. If the name structure is more complex, further customization of functions may be required to accommodate different desensitization needs.

4. Email

Desensitizing a mailbox usually means keeping the first part of the mailbox (i.e., the username part) and the domain part, while replacing the middle part of the username with an asterisk (*).

function desensitizeEmail(email) {
  if (!email || !('@')) {
    ('Please enter a valid email address');
    return '';
  }

  // Separate the username part and domain name part of the mailbox  const [username, domain] = ('@');
  // Determine the length of the user name after desensitization, and keep the two characters in front and after.  const visibleLength = 2;
  // If the username length is less than or equal to the reserved length, no desensitization will be performed  if ( <= visibleLength * 2) {
    return email;
  }

  // The desensitized username part, replace it with an asterisk in the middle.  const visibleUsername = (0, visibleLength) + '*'.repeat( - visibleLength * 2) + ( - visibleLength);
  // Recombind the desensitized email address  return visibleUsername + '@' + domain;
}

// Example(desensitizeEmail('example@')); // Output: e****m@(desensitizeEmail('user123@')); // Output: u******3@(desensitizeEmail('test@')); // Output: t****e@

This function accepts a mailbox string as a parameter, first checking whether the input is valid (i.e. whether it contains@symbol). It then splits the email address into a username section and a domain section. If the length of the username portion is less than or equal to the reserved length (in this example, 2 characters each before and after), then desensitization will not occur. Otherwise, it replaces the middle part of the username with an asterisk.

Please note that this function retains 2 characters in the front and back by default, but you can adjust it as needed.visibleLengthvalue. In addition, if the email address is very short, the function will directly return to the original email address without desensitization.

Summarize

This is the article about the front-end desensitization of personal information (mobile phone number, ID number, name, email address) that ends with this article. For more relevant front-end personal information desensitization content, please search for my previous articles or continue browsing the related articles below. I hope everyone will support me in the future!