博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
【开源社群系统研发日记五】ThinkSNS+ 是如何计算字符显示长度的
阅读量:6880 次
发布时间:2019-06-27

本文共 1256 字,大约阅读时间需要 4 分钟。

hot3.png

什么是ThinkSNS+

ThinkSNS(简称TS),一款全平台综合性,为国内外大中小企业和创业者提供社会化软件研发及技术解决方案,目前最新版本为ThinkSNS+。

输入图片说明

今天我们来聊一下可能很多人都会头疼的东西:显示长度。

需求是这样的,在字符的显示上,两个英文单词才占一个中文或者其他语言的显示长度。如下:

输入图片说明

上面排的是两个英文字母,一个汉字,一个Emoji。你会发现,在显示上占的宽度是一致的。一些设计上为了好看也要求有这样的处理。

例如,我们的用户名需求是最多12个非单字节字符或者24个单字节字符的需求也可以混合排的需求,我们写后端不得不处理这样的验证了。

需求规则是 /^[a-zA-Z_\x7f-\xff][a-zA-Z0-9_\x7f-\xff]*$/

在ThinkSNS+中,为了能把这部分验证公用,所以选择使用自定义验证规则。我们先说下计算的实现思路吧!

首先,就算是mb_strlen也没法准确的获取多字节字符和单子节字符混合在一起的长度,网上有个说法,汉字占三个字节,英文数组半角符号占一个字节,所以:

输入图片说明

用这个方法可以得到单字节占0.5多字节占1的计算。但是以中文为例,只有两万个汉字才是这种情况,还有六万多汉字是四个,其次,emoji也是四个字节。根本无法准确的计算。

好在在无意间发现一个奇怪的东西str_word_count 这个函数计算非英文单词外是除了符号例如中文就是按照汉字个数算的,emoji也是同理。

发现这个以后,咱们就好办了。我们吧用户名中的 [a-aA-Z0-9_] 剔除掉,单独计算不就是我们要的验证长度了吗?

所以,首先我们用:

输入图片说明

方式单独计算出单字节字符的显示长度,再用:

输入图片说明

方式计算出多字节的长度,最后:

输入图片说明

就得出了显示长度,实现了,最后封装成验证规则:

输入图片说明

代码是原型代码,还没有进行优化,之后我们只要按照下面的方式用:

输入图片说明

现在就很好的解决了这个需求。

我们很乐意,将基于 Laravel 的 ThinkSNS+ 产品开发中的技术解决方案分享给大家,也希望喜欢的朋友能给国内开源产品一点点的支持。

【源码授权购买】

现行稳定系统V4系列全端产品(PC / H5 / APP)授权源码购买,产品体验,请致电:18108035545。

开源版源码官方正版获取唯一渠道:关注公众号“thinksns”,回复“开源版”即可获得最新源码压缩文件地址。

【开源代码仓库】

GitHub:(点击star,每日关注开发动态。)

咨询QQ:3298713109

官网:

【内测申请方式】

提供个人/企业联系方式及认证信息(真实姓名

参与内测请提供以下资料

1个可接收验证码的手机号

1个指定邮箱

1位测试人员姓名

1个您喜欢的账号昵称

开源不易,为了争取开源,我们团队做了很多努力。把基于Laravel的作品展示在大家面前,之后专栏会持续不断的分享ThinkSNS +开发过程中的技术细节。

转载于:https://my.oschina.net/thinksnsTS/blog/909647

你可能感兴趣的文章
初探 BaconJS
查看>>
开源改变世界,改变你和我
查看>>
使用CDN(Content Delivery Network)加速站点访问速度汇总指北
查看>>
区块链生态圈应用落地须了解区块链共识技术开发
查看>>
ES6学习文档(更新至第7节)
查看>>
再次理解伪类选择器:nth-child(){……}
查看>>
MongoDB 在windows服务器安装部署与远程访问配置
查看>>
自定义兼容IE8的复选框
查看>>
开源大数据周刊-第68期
查看>>
区块链100讲:如果连电子钱包都不懂,还谈什么区块链开发(有彩蛋)
查看>>
Java NIO(八) FileChannel
查看>>
打破铁三角:新的项目管理角度
查看>>
Java虚拟机07——类加载器与双亲委派模型
查看>>
iOS实现类似苹果手机原生的锁屏界面(数字密码)
查看>>
express框架链接池的使用
查看>>
基于Transform实现更高效的组件化路由框架
查看>>
24 个实例入门并掌握「Webpack4」(三)
查看>>
linux网卡配置
查看>>
一个有趣的Js逗号表达式
查看>>
node服务适配前端路由
查看>>