如何实现禁止交换敏感信息的聊天功能?求推荐JS库
Got it, let's break down how to tackle this chat content filtering problem effectively—you need to block personal info like phone numbers, links, and social platforms (Facebook, Twitter, WhatsApp) while preventing workarounds, and want quick-to-use JS libraries. Here's what I recommend:
Before diving into libraries, focus on these key areas to build a robust filter:
- Dual-layer detection: Validate content both as the user types (on input events) and right before sending the message. This gives instant feedback to users and catches last-minute edits.
- Variant coverage: Don’t rely on strict regex alone—account for format variations (e.g., phone numbers with spaces/dashes, social platform shorthands like "fb" or "wa") and obfuscated text (like "f@ceb00k").
- Backend fallback: Frontend filtering is for UX, but always replicate the same logic on your backend. This stops users from bypassing frontend checks by modifying client-side code.
These tools let you get up and running fast without building everything from scratch:
1. DOMPurify + Custom Regex
While DOMPurify is mainly for XSS protection, it pairs perfectly with custom regex to filter sensitive content. It’s lightweight, well-maintained, and handles edge cases like HTML-injected text.
import DOMPurify from 'dompurify'; const filterSensitiveContent = (text) => { // Match phone numbers (covers country codes, spaces, dashes) text = text.replace(/(\+?\d{1,3}[-.\s]?)?\d{3}[-.\s]?\d{3}[-.\s]?\d{4}/g, '(Hidden infos)'); // Match social platforms and their shorthands const socialRegex = /(facebook|fb|twitter|x|whatsapp|wa)/gi; text = text.replace(socialRegex, '(Hidden infos)'); // Match all HTTP/HTTPS links and shorthand URLs const urlRegex = /https?:\/\/(www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_\+.~#?&//=]*)/g; text = text.replace(urlRegex, '(Hidden infos)'); // Sanitize any remaining HTML to prevent XSS return DOMPurify.sanitize(text); }; // Example usage const originalMsg = "Hi John, my number is 06632878 78—hit me up on WhatsApp or check my Facebook: https://fb.com/myprofile"; const filteredMsg = filterSensitiveContent(originalMsg); console.log(filteredMsg); // Output: Hi John, my number is (Hidden infos)—hit me up on (Hidden infos) or check my (Hidden infos): (Hidden infos)
2. bad-words
A tiny, focused library built for sensitive word filtering. You can extend its default word list to include social platform terms, then pair it with regex for phone numbers and links.
import Filter from 'bad-words'; const filter = new Filter(); // Add custom social platform keywords filter.addWords('facebook', 'fb', 'twitter', 'x', 'whatsapp', 'wa'); const filterContent = (text) => { // Handle phone numbers and links first text = text.replace(/(\+?\d{1,3}[-.\s]?)?\d{3}[-.\s]?\d{3}[-.\s]?\d{4}/g, '(Hidden infos)'); text = text.replace(/https?:\/\/(www\.)?[-a-zA-Z0-9@:%._\+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_\+.~#?&//=]*)/g, '(Hidden infos)'); // Filter sensitive social terms return filter.clean(text); };
3. natural (For Advanced Semantic Detection)
If you need smarter filtering (e.g., identifying context like "my phone is" followed by digits), this NLP library can help. It’s a bit heavier, but great for catching nuanced workarounds that basic regex might miss.
- Obfuscation handling: Use regex to match character replacements (e.g.,
f@ceb00k→ replace with(Hidden infos)) or libraries likestring-similarityto detect close matches to sensitive terms. - Context checks: Add logic to flag phrases like "call me at" or "add me on" followed by potential contact info, even if the format isn’t perfect.
- User feedback: When content is filtered, let users know what was blocked (without showing the sensitive info) to reduce frustration.
内容的提问来源于stack exchange,提问作者TheFuquan

