前端实现个人信息脱敏(手机号、身份证号、姓名、邮箱)JavaScript代码示例
目录
前言
在当今数字化时代,个人信息的安全与隐私保护已成为公众关注的焦点。本文将通过JavaScript代码示例,演示如何对手机号、身份证号、姓名、邮箱等个人数据进行脱敏处理。确保满足需求的同时保护用户的隐私。
一、手机号
手机号脱敏通常保留前三位和后四位,中间四位用星号替换。通过正则表达式匹配手机号的结构,并使用分组捕获前三位和后四位,中间四位替换为星号。
phoneHide(phone) { let reg = /^(1[3-9][0-9])d{4}(d{4}$)/; // 定义手机号正则表达式 phone = phone.replace(reg, '$1****$2'); return phone; }
使用正则表达式对手机号进行脱敏
二、身份证号
对身份证号进行脱敏通常意味着保留身份证号的前几位和后几位,而将中间的部分替换为星号。
function desensitizeIDCard(idCard) { if (!idCard || idCard.length < 6) { console.error('请输入有效的身份证号码'); return ''; } // 中国大陆的身份证号码长度为18位 const idLength = 18; // 保留前6位和后4位,中间替换为星号 const prefix = idCard.substr(0, 6); const suffix = idCard.substr(idLength - 4); const middle = '*'.repeat(idLength - 10); return prefix + middle + suffix; } // 示例 console.log(desensitizeIDCard('123456199001010012')); // 输出: 123456*********0012
三、姓名
对姓名数据进行脱敏通常意味着将姓名的一部分替换为星号(*)或其他占位符,以保护个人隐私。
function desensitizeName(name, options) { // 默认脱敏选项 const defaultOptions = { showFirstLetter: true, // 是否显示第一个字母 starLength: 3 // 脱敏字符的长度 }; // 合并用户选项和默认选项 const settings = {...defaultOptions, ...options}; // 检查是否是中文姓名 const isChineseName = /[u4e00-u9fa5]/.test(name); // 脱敏函数 const desensitize = (str) => { const firstLetter = str[0]; const restLength = str.length - 1; const stars = settings.showFirstLetter ? '*'.repeat(restLength) : '*'.repeat(str.length); return firstLetter + stars; }; if (isChineseName) { // 假设中文姓名由两个或三个字组成 return desensitize(name); } else { // 英文姓名可能由多个单词组成 const parts = name.split(' '); const desensitizedParts = parts.map(part => desensitize(part)); return desensitizedParts.join(' '); } } // 示例 console.log(desensitizeName('张三', { showFirstLetter: true, starLength: 2 })); // 输出: 张** console.log(desensitizeName('李四', { showFirstLetter: false })); // 输出: *** console.log(desensitizeName('John Doe', { showFirstLetter: true, starLength: 2 })); // 输出: J*** D**
此函数接受一个姓名字符串和一个选项对象。选项对象可以包含两个属性:showFirstLetter
决定是否显示姓名的第一个字母,starLength
决定脱敏后显示的星号数量。函数会根据这些选项对中文或英文姓名进行脱敏处理。
请注意,这个函数假设中文姓名由两个或三个汉字组成,而英文姓名由空格分隔的多个单词组成。如果姓名结构更复杂,可能需要进一步定制函数以适应不同的脱敏需求。
四、邮箱
对邮箱进行脱敏通常意味着保留邮箱的第一部分(即用户名部分)和域名部分,而将用户名的中间部分替换为星号(*)。
function desensitizeEmail(email) { if (!email || !email.includes('@')) { console.error('请输入有效的邮箱地址'); return ''; } // 分离邮箱的用户名部分和域名部分 const [username, domain] = email.split('@'); // 确定用户名部分脱敏后的长度,这里保留前后各2个字符 const visibleLength = 2; // 如果用户名长度小于或等于保留长度,则不进行脱敏 if (username.length <= visibleLength * 2) { return email; } // 脱敏用户名部分,中间用星号替换 const visibleUsername = username.substring(0, visibleLength) + '*'.repeat(username.length - visibleLength * 2) + username.substring(username.length - visibleLength); // 重新组合脱敏后的邮箱 return visibleUsername + '@' + domain; } // 示例 console.log(desensitizeEmail('example@email.com')); // 输出: e*****m@email.com console.log(desensitizeEmail('user123@domain.com')); // 输出: u*****3@domain.com console.log(desensitizeEmail('test@website.org')); // 输出: t****e@website.org
此函数接受一个邮箱字符串作为参数,首先检查输入是否有效(即是否包含@
符号)。然后,它将邮箱地址分割为用户名部分和域名部分。如果用户名部分的长度小于或等于保留长度(在这个例子中是前后各2个字符),则不会进行脱敏。否则,它将用户名的中间部分替换为星号。
请注意,这个函数默认保留了前后各2个字符,但你可以根据需要调整visibleLength
的值。此外,如果邮箱地址很短,函数会直接返回原邮箱地址,不进行脱敏。
总结
到此这篇关于前端实现个人信息脱敏(手机号、身份证号、姓名、邮箱)的文章就介绍到这了,更多相关前端个人信息脱敏内容请搜索科站长以前的文章或继续浏览下面的相关文章希望大家以后多多支持科站长!
上一篇:详解React如何使用useReducer高阶钩子来管理状态
栏 目:JavaScript
本文标题:前端实现个人信息脱敏(手机号、身份证号、姓名、邮箱)JavaScript代码示例
本文地址:https://www.fushidao.cc/wangluobiancheng/3201.html
您可能感兴趣的文章
- 02-11js中基本事件的总结(onclick、onblur、onchange等)
- 02-11详解如何在Node.js中使用中间件处理请求
- 02-11Vue3中Provide和Inject的用法及工作原理详解
- 02-11Vue+vant实现图片上传添加水印
- 02-11快速解决 keep-alive 缓存组件中定时器干扰问题
- 02-11uniapp 使用 tree.js 解决模型加载不出来的问题及解决方法
- 02-11基于uniapp vue3 的滑动抢单组件实例代码
- 02-10JavaScript 中的 Map使用指南
- 02-10vue3中使用print-js组件实现打印操作步骤
- 02-10Vue 中v-model的完整用法及v-model的实现原理解析


阅读排行
推荐教程
- 04-23JavaScript Array实例方法flat的实现
- 04-23THREE.JS使用TransformControls对模型拖拽的代码实例
- 04-23Vue3使用v-if指令进行条件渲染的实例代码
- 04-23vue3+ts项目搭建的实现示例
- 04-23JavaScript实现下载超大文件的方法详解
- 04-23vue如何使用pdf.js实现在线查看pdf文件功能
- 04-23vue.js调用python脚本并给脚本传数据
- 12-18使用JavaScript遍历输出页面中的所有元素的方法详解
- 04-23JS加密解密之保存到桌面书签
- 12-18Vue实现滚动加载更多效果的示例代码