社交应用动态九宫格图片的规则

简介: 这里主要以微信和QQ空间为作为研究对象,得到的结论如下。 QQ空间里的动态 iOS设备,以iPhone6为分界 iPhone6及以上分辨率的设备: 当宽且高同时 > 512px时,判断 宽/高的比例值:大于 2时,以高度为基准,缩小到512px,宽度等比缩、小于等于 2时,以宽度为基准...

这里主要以微信和QQ空间为作为研究对象,得到的结论如下。

QQ空间里的动态

iOS设备,以iPhone6为分界

iPhone6及以上分辨率的设备:

  • 当宽且高同时 > 512px时,判断 宽/高的比例值:大于 2时,以高度为基准,缩小到512px,宽度等比缩、小于等于 2时,以宽度为基准,缩小到512px,高度等比缩
  • 当宽、高其中一边小于512px,直接下原图;

iPhone6以下的设备(5s、SE、4s),判断条件同上,只是将512px改为200px

Android规则同上,只是以1280分辨率为分界

 

QQ空间是尽量平铺占满宽度,二张图片时平分宽度,三张时也平分宽度,均占一行,四张时像四个象限一样,上、下各占一行,五张是上三张下二张,六张时上、下各三张,七、八、九张就铺第三行了。

 

 

微信朋友圈

未对屏幕进行区分,但对只上传一张图片进行了特殊的处理,二张或二张以上的图片宽 x 高以150为阀值,二边都大小150时,以较小的一边为基准进行等比缩放。

当图片为三张时,3、5位置对调,排成一行:1、2、3,二张时排一行:1、2,格子大小提前就已经占好位置。

 

单张图片,如果0.5 < = 宽 / 高 <= 2 时,被限定在1 - 4格子的范围大小(包括间距)

 

单张图片,宽 / 高 > 2的图片(如全景图),最多占三栏,高最多占一栏(包括间距大小)

 

宽 / 高 < 0.5(如微博长图),高最多占二栏,宽度最小占二栏1/3(包括间距)

image

 

 

朋友圈与QQ空间的区别在于,大小一张图片的时候,微信是按事先定义好的格子大小放图片,而QQ空间则是按平分屏幕宽度来算的。从使用角度来讲,二者的主要区别在于QQ空间更加突出图片这个属性,我的iPhone6 Plus一屏如果某条动态有9张图片,那基本上我只能看全一条动态,而朋友圈,我一屏至少可以看到二条均带9张图片的动态,图片占幅不算特别大,而且可以看得清部分的文字,看上去感觉更加和谐一些。

 

上述的规则可能存在不准确的地方,是通过反复测试、抓包方式来推断出来的,微信因为使用的是ipv6,而且图片貌似是动态CDN,有权限的验证,请求图片时并没有直接返回图片,而是一个类似二进制的文件,这样做的目的估计是出于产品隐私性的考虑吧,毕竟微信是面向熟人的,如果图片的规则能被破解或者url能直接主动,势必会让使用微信的用户觉得我发的图片并不是真正的私密(不安全),不过动态CDN成本比静态CDN高出不少。

 

这里先贴出部分能抓到的微信请求的url

// 视频封面 320 x 240
http://vweixinthumb.tc.qq.com/150/20250/snsvideodownload?filekey=30270201010420301e02020096040253480410600248dca5d9c581e27fbd5111a9349b0202151b0400&bizid=1023&hy=SH&fileparam=302c020101042530230204816d4328020458059a8502024f1a02031e8d7e02030f424002042f5e320a0201000400

// 个人头像 132 x 132
http://wx.qlogo.cn/mmhead/ver_1/UGuDguTdib0mHzgxB0I5SegibWXM5w3wuIOEVWygIOrLPcL5E50SAtFuq0ia9ichPMWmadEOTfTmzr0LF8hIjE4zJw/132

// 视频封面 320 x 240 = 4 : 3
http://vweixinthumb.tc.qq.com/150/20250/snsvideodownload?filekey=30270201010420301e02020096040253480410f1f2401a6c62f09ececa00c6cf099f3902023b9b0400&bizid=1023&hy=SH&fileparam=302c0201010425302302046cfba775020458048d5402024f1a02031e8d7d02030f424002041260320a0201000400

// 9张图片中的一张 150 x 200 = 3 : 4
http://140.207.234.29/mmsns/kiaXicXJs2M4d4Cj5yoIFEcPBQlNiaos8DGA33icYyhcYPrf1S90BSnHj6JC7YnTrotyjibXOrmkgmOo/150?tp=wxpc&length=2208&width=1242

// 150 x 150
http://140.207.234.29/mmsns/czSFWUxMIFicELY0FicKp8mAKEPgR7TMGwSLE8Ue2TTB6N5nfhrNSAE0Hn0UcVicJYlSzN24Sy4C6I/150?tp=wxpc&length=2208&width=1242

// 某条消息 150 x 68
http://140.207.234.32/mmsns/kqodNCVWpEuNZC3Qicgqw0YBlwXlhO9agvRaiaTDoOUnSibRFtNf9KDS57dYp0to1Z2RM0tQicYZCZg/150?tp=wxpc&length=2208&width=1242

// 群头像 139 x 139
http://223.167.86.100/mmcrhead/Q3auHgzwzM4SzCRNKrGw4Qr3iarHic17WGvuJm6o8lQcicludw8LPmW3Jb783SgFZqNLTYfJFHjkJdy65ppUwNM1w/0

// 自己的朋友圈封面 640 x 640
http://140.207.234.31/mmsns/4376ae1e0cf0ccced233def9ad1560d0dec29d64941ab85a818b17f43e6dadabcba7fb71e9dd2494fdead4b0db253944831124813608c824/0?tp=wxpc&length=2208&width=1242

// 225 x 150
http://140.207.234.31/mmsns/LwcbhAmMnZCGOvDT3GV29UDibiaoSiauzPfTJ0C8LIwERqxsFUTgtxq8PN9zuXeuLwyWBdajS83l5I/150?tp=wxpc&length=2208&width=1242

//默认图像 70 x 70
http://mmsns.qpic.cn/mmsns/iaxNB5XaibCeLTYWIUGCYm7cS1kFxTx4ibUSEBZJ6VnOdXPDItJ9PaGRg/0

// 个人头像96 x 96
http://wx.qlogo.cn/mmhead/PiajxSqBRaEJACUXXpRJhrQaSa2ic9EY4C3H5jC8eGP050nUlNSa05sw/96

// 广告334 x 200
http://mmbiz.qpic.cn/mmbiz/m79YxykhR1vKicdfyicOTQlWl2zkZRftMjw0lQvclPfEo5t7wkDGLNh2Vgxjr50fxlp9tE3Nb6LwO98Sh2UfREHg/640?wxfrom=5&wx_lazy=1

// 6张图片 150 x 203
http://140.207.234.30/mmsns/y5RpFDuUObyB1wvAlG2ib2rGwXictXHPzFsFo1UYrzD9BYKmHoeEibxCPzicxQ9OibHdljqMmJSFrFXM/150?tp=wxpc&length=2208&width=1242

// 200 x 150
http://140.207.234.30/mmsns/y5RpFDuUObyB1wvAlG2ib2licuKrosSWmHVxbjfzdEk30iaKbSHft9U5W5ZHqQbHhq7wpz72NtCgQ8/150?tp=wxpc&length=2208&width=1242

目录
相关文章
|
Shell Linux 开发工具
【Shell 命令集合 文件管理】Linux 高级的文件管理器 mc 命令解析
【Shell 命令集合 文件管理】Linux 高级的文件管理器 mc 命令解析
470 0
|
安全 编译器 Swift
IOS开发基础知识: 对比 Swift 和 Objective-C 的优缺点。
IOS开发基础知识: 对比 Swift 和 Objective-C 的优缺点。
1185 2
|
存储 Kubernetes Linux
带你读《存储漫谈Ceph原理与实践》第三章接入层3.1块存储 RBD
《存储漫谈Ceph原理与实践》第三章接入层3.1块存储 RBD
带你读《存储漫谈Ceph原理与实践》第三章接入层3.1块存储 RBD
|
人工智能 自然语言处理 机器人
对话阿里云 CIO 蒋林泉:AI 时代,企业如何做好智能化系统建设?
10 月 18 日, InfoQ《C 位面对面》栏目邀请到阿里云 CIO 及 aliyun.com 负责人蒋林泉(花名:雁杨),就 AI 时代企业 CIO 的角色转变、企业智能化转型路径、AI 落地实践与人才培养等主题展开了讨论。
24246 69
对话阿里云 CIO 蒋林泉:AI 时代,企业如何做好智能化系统建设?
|
搜索推荐 物联网 智能硬件
智能穿戴设备的应用场景
智能穿戴设备的应用场景广泛且多样化,它们不仅提升了日常生活的便利性,还融入了健康管理和科技娱乐等多个方面。以下是一些具体的智能穿戴设备应用场景:
|
6月前
|
缓存 编译器 Shell
【实战指南】 CMake搭建编译环境总结
本文总结了使用CMake搭建编译环境的技巧,涵盖单个及多个源文件的编译、CMakeLists嵌套管理、变量设置、交叉编译配置、常用编译选项及警告处理等内容。通过实例说明了如何高效组织工程结构,并利用CMake灵活控制编译流程,适用于嵌入式开发场景。
981 40
|
8月前
|
自然语言处理 调度 决策智能
掌握Multi-Agent实践(二):基于AgentScope构建支持@机制的群聊系统,实现定向对话机制
掌握Multi-Agent实践(二):基于AgentScope构建支持@机制的群聊系统,实现定向对话机制
564 10
|
NoSQL JavaScript 算法
Higress 全新 Wasm 运行时,性能大幅提升
本文介绍 Higress 将 Wasm 插件的运行时从 V8 切换到 WebAssembly Micro Runtime (WAMR) 的最新进展。
55915 97
|
机器学习/深度学习
【机器学习】决策树为什么对缺失值不敏感,如何处理缺失值?
文章探讨了决策树对缺失值不敏感的原因,并提出了处理缺失值的多种策略,包括在属性选择、分割点决定和模型测试阶段的不同处理方法。
520 1
|
机器学习/深度学习 编解码 自然语言处理
Swin-Unet: Unet-like Pure Transformer for Medical Image Segmentation论文解读
在过去的几年中,卷积神经网络(CNN)在医学图像分析方面取得了里程碑式的进展。特别是基于U型结构和跳跃连接的深度神经网络在各种医学图像任务中得到了广泛的应用。
1293 0