分析了公众号源码，原来标题可以加emoji！

最新推荐文章于 2024-09-10 17:36:36 发布

程序员的店小二

最新推荐文章于 2024-09-10 17:36:36 发布

阅读量963

点赞数 1

文章标签： chatgpt

公众号上发表了一篇文章，原本希望在文章的标题中添加一个 emoji 表情符 💉，直接被提示错误：“标题中不能含有特殊字符”。

公众号标题特殊字符报错

当时也没有多想，以为 emoji 表情符被公众号标题给禁用了。

可是过了一段时间，发现有些公众号文章的标题是可以包含表情符的，比如：🤙🥗🥘🦋🤩。

这激起了我的好奇心，到底哪些 emoji 表情符可以加入到公众号的标题中？

带着这个问题，首先网上搜索了一番。得到的答案要么是某个编辑器的推广文案，要么是零星地列出几种可以使用的 emoji 表情符号。没有一个答案是完美的。

我希望能够一网打尽所有可以在公众号标题可用的 emoji 表情符。于是便有了这篇文章，描述一下我是如何找到想要的答案的。

先说一下结论：

emoji 表情符总共 1847 个，公众号标题可用的是 396 个，占总数的 21%。可用表情符占比

如果你想知道这 396 个 emoji 都是哪些，那么可以直接跳到文件的结尾，我已经都列出来了。

如果你继续看下去，你还可以从中了解我的解题思路，包括以下一些内容：

如何使用 ChartGPT 帮助解读代码
限制标题使用 emoji 的正则表达式
Unicode 编码转换 UTF 16 的方式

1. 找到报错的地方

现在唯一的线索是报错的信息“标题中不能含有特殊字符”。根据经验判断，这个报错大概率是一个前端的 JavaScirpt 的功能实现。

让我们来尝试找找这个 js 文件。

在 DevTools 模式下，遍历 js 文件看看有没有包含报错信息关键字 标题。

DevTools 模式

果然，在这个路径下找到了一段代码。

https://res.wx.qq.com/mpres/zh_CN/htmledition/js/default~advanced/menuSetting~bizpage/list~cardticket/member_message~discuss/list~discuss

a.title = function(n) {
    var o = n.content || ""
      , i = n.maxlen || 64;
    return A.rangelength(o, [0, i]) ? !e.test(o) || {
        msg: "%s中不能含有特殊字符".sprintf(n.label || "标题"),
        errType: 2
    } : {
        msg: "%s长度不能超过%s字".sprintf(n.label || "标题", i),
        errType: 1
    }
}

看这报错代码msg: "%s中不能含有特殊字符".sprintf(n.label || "标题")，这不正是我们需要的嘛！！

2. 使用 ChatGPT 解读代码

如何能快速地读懂代码？当红辣子鸡 ChatGPT 无疑是目前最好的选择。

现在，让 ChatGPT 帮我们解读一下上面的代码。

ChatGPT 解释代码

答案很完美，找到我们关注的重点：

函数使用正则表达式 e 来检查内容中是否含有特殊字符。如果含有特殊字符，则返回一个错误对象。

代码中使用正则表达式 e 来判断是否含有特殊字符串。在这个 js 文件中继续搜索 e 寻找正则表达式。

问题的关键环节出现了：

 var e = /[\u2600-\u27BF]|[\u2B00-\u2BFF]|[\u3291-\u32B0]|[\uD83C\uD83D][\uDC00-\uDFFF]/

3. 理解制定规则的正则表达式

这个正则表达式本身并不复杂，但这些是如何跟 emoji 表情关联的呢？

这涉及到对字符集的理解。

简单地说，每个 emoji 都有自己的 Unicode 编码。

比如，⭐ 的编码就是 U+2B50。这个编码被正则表达中的第二部分 [\u2B00-\u2BFF] 匹配，所以它就属于“特殊字符”。

4. Unicode 代码转换为 UTF 16

理解这个正则表达式的时候，问题发生在最后一部分 [\uD83C\uD83D][\uDC00-\uDFFF]。

这跟平时正常看到的 emoji 的 Unicode 编码匹配不上。理解这段代码需要两个前提：

知道 Javascript 中 emoji 都转换成 UTF 16
知道 Unicode 如何转换成 UTF 16

Unicode 转换成 UTF 16 分两种情况。

之前介绍的 ⭐ U+2B50，只有两个字节，所以它的 UTF 16 和 Unicode 一样都是 U+2B50。

而我们经常使用的😀 U+1F600 长度超过了两个字节，需要转换成高位代理对和低位代理对，具体方法如下图。

Unicode 转换 UTF 16

😀 U+1F600 转换成 UTF 16 U+D83D U+DE00，可以被正则表达式中的最后一部分 [\uD83C\uD83D][\uDC00-\uDFFF] 匹配，所以它也属于“特殊字符”。

5. 找到所有可以使用的 emoji 表情符

明白了规则之后，我们就来找出所有可以使用的 emoji 表情符。

访问 unicode 官网，找到所有的 emoji 表情符。

https://unicode.org/emoji/charts/full-emoji-list.html

然后，将官网的 emoji 表格复制到一个新建的页面，再手写一段 js 代码，查出所有可以使用的表情符，大功告成！

var e = /[\u2600-\u27BF]|[\u2B00-\u2BFF]|[\u3291-\u32B0]|[\uD83C\uD83D][\uDC00-\uDFFF]/;

$("table tr").each(function(){
    var char = $(this).find('td.chars').text();
    if(!e.test(char)){
        i++;
        var num = $(this).find('td.rchars').text();
        var unicode = $(this).find('td.code').text();
        console.log(`${num} ${char} ${unicode} `);
    }
});

6. 结果

在现有规则下，总共 396 个 emoji 表情符可以被公众号标题所使用，这里分享给大家，希望能给大家的公众号标题添加一抹颜色。

type	emoji
face-smiling	🤣🫠
face-affectionp	🥰🤩🥲
face-tonguep	🤪🤑
face-hand	🤗🤭🫢🫣🤫🤔🫡
face-neutral-skeptical	🤐🤨🫥🤥
face-sleepy	🤤
face-unwell	🤒🤕🤢🤮🤧🥵🥶🥴🤯
face-hat	🤠🥳🥸
face-glasses	🤓🧐
face-concerned	🫤🥺🥹🥱
face-negative	🤬
face-costume	🤡🤖
heart	🧡🤎🤍
hand-fingers-open	🤚🫱🫲🫳🫴
hand-fingers-partial	🤌🤏🤞🫰🤟🤘🤙
hand-single-finger	🫵
hand-fingers-closed	🤛🤜
hands	🫶🤲🤝
hand-prop	🤳
body-parts	🦾🦿🦵🦶🦻🧠🫀🫁🦷🦴🫦
person	🧒🧑🧔🧑‍🦰🧑‍🦱🧑‍🦳🧑‍🦲🧓
person-gesture	🧏🤦🤷
person-role	🥷🫅🤴🧕🤵🤰🫃🫄🤱
person-fantasy	🤶🦸🦹🧙🧚🧛🧜🧝🧞🧟🧌
person-activity	🧍🧎🧑‍🦯🧑‍🦼🧑‍🦽🧖🧗
person-sport	🤺🤸🤼🤽🤾🤹
person-resting	🧘
family	🧑‍🤝‍🧑
person-symbol	🫂
hair-style	🦰🦱🦳🦲
animal-mammal	🦍🦧🦮🦊🦝🦁🦄🦓🦌🦬🦙🦒🦣🦏🦛🦫🦔🦇🦥🦦🦨🦘🦡
animal-bird	🦃🦅🦆🦢🦉🦤🪶🦩🦚🦜
animal-reptile	🦎🦕🦖
animal-marine	🦭🦈🪸
animal-bug	🦋🪲🦗🪳🦂🦟🪰🪱🦠
plant-flower	🪷🥀
plant-other	🪴🪹🪺
food-fruit	🥭🫐🥝🫒🥥
food-vegetable	🥑🥔🥕🫑🥒🥬🥦🧄🧅🥜🫘
food-prepared	🥐🥖🫓🥨🥯🥞🧇🧀🥩🥓🥪🫔🥙🧆🥚🥘🫕🥣🥗🧈🧂🥫
food-asian	🥮🥟🥠🥡
food-marine	🦀🦞🦐🦑🦪
food-sweet	🧁🥧
drink	🥛🫖🥂🥃🫗🥤🧋🧃🧉🧊
dishware	🥢🥄🫙
place-map	🧭
place-building	🧱🪨🪵
transport-ground	🦽🦼
transport-air	🪂
hotel	🧳
time	⌛⏳⌚⏰⏱⏲
sky & weather	🪐
event	🧨🧧
award-medal	🥇🥈🥉
sport	🥎🥏🥍🥊🥋🥅🤿🥌
game	🪀🪁🪄🧩🧸🪅🪩🪆
arts & crafts	🧵🪡🧶🪢
clothing	🥽🥼🦺🧣🧤🧥🧦🥻🩱🩲🩳🩴🥾🥿🩰🧢🪖
musical-instrument	🪗🪕🥁🪘
computer	🪫⌨🧮
light & video	🪔
money	🪙🧾
tool	🪓🪃🪚🪛🦯🪝🧰🧲🪜
science	🧪🧫🧬
medical	🩸🩹🩼🩺🩻
household	🪞🪟🪑🪠🪤🪒🧴🧷🧹🧺🧻🪣🧼🫧🪥🧽🧯
other-object	🪦🧿🪬🪧🪪
arrow	↗️↘️↙️↖️↕️↔️↩️↪️⤴️⤵️
av-symbol	▶️⏩⏭️⏯️◀️⏪⏮️⏫⏬⏸️⏹️⏺️⏏️
punctuation	‼️⁉️〰️
other-symbol	〽©®™
keycap	#️⃣*️⃣0️⃣1️⃣2️⃣3️⃣4️⃣5️⃣6️⃣7️⃣8️⃣9️⃣
alphanum	ℹⓂⓂ️
geometric	◼◻◾◽▪▫