微信头像地址失效踩坑记附带解决方案


Posted in Javascript onSeptember 23, 2019

微信头像失效问题说明?

最近工作遇到一个微信头像失效的问题,情况是这样的,我们一个h5页面在微信授权后打开,会存储微信相关昵称和头像信息,不过,我们没有保存图片到自己的服务器,而是仅仅存储微信头像地址,然而过了n多天后,用户在微信修改了自己的头像,这时候,我们的服务是无感知的,又过了n多天,用户去访问我们那个h5页面,发现自己的头像是这样的:

微信头像地址失效踩坑记附带解决方案

用户找到我们,说自己有头像呀,怎么没显示呢?
我们也反问他,是否最近改过头像呢,他说没,不过很早之前改过。

而此时就比较尴尬,用户体验超级不好。

然后我们就去查看官方文档,发现这么说的:

官方文档说明-获取用户个人信息

微信头像地址失效踩坑记附带解决方案

官方也建议自己保存下来处理。

然后我们又去google了一把,看下别人是否也被同样的问题坑过。

微信头像地址失效踩坑记附带解决方案

微信头像地址失效踩坑记附带解决方案

看来好多用户都遇到了,相关问题链接

经常看到还有人的头像时而好时而不好,那是因为

旧的头像链接失效需要一定的时间,从 CDN 节点一个一个失效。你现在访问到的应该是旧的头像链接,每次访问可能到达不同的 CDN 节点,导致时有时无。

那么如何解决这个问题呢?

我们这边也想了好多方案,我们考虑下几个方面,分两个思路

思路1: 自己本地服务保存并CDN,缺点成本有点高

思路2: 有个策略定时更新头像

  • 定期更新下头像链接,不要一直缓存着,比如在 session_key 过期时一起更新下头像链接
  • 后台服务定期检查头像链接是否过期(怎么自动判断是否过期呢,下面会详细说明)
  • 前端根据头像链接判断是否过期,过期重新授权更新头像信息

下面介绍下,怎么判断微信的头像是否过期了,经过研究发现:

正常的微信图片返回的请求信息如下:

微信头像地址失效踩坑记附带解决方案

然而异常的图片地址怎么返回的呢?

微信头像地址失效踩坑记附带解决方案

可以看下异常情况,返回的信息不一样,可以根据X-Info: notexist:-6101 判断或者 X-ErrNo: -6101 关键字

不过还有一个疑问,如果本地存储的话,还会遇到,用户修改头像后,获取的地址可能不是最新的,虽然不会显示一个特别丑陋的头像,这里怎么解决呢,这里需要产品定义个策略,哪些场景需要定期授权,重新更新头像和用户信息等等。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
基于jquery的合并table相同单元格的插件(精简版)
Apr 05 Javascript
JavaScript中的this实例分析
Apr 28 Javascript
js中判断数字\字母\中文的正则表达式 (实例)
Jun 29 Javascript
JavaScript创建一个欢迎cookie弹出窗实现代码
Mar 15 Javascript
在IE8上JS实现combobox支持拼音检索功能
May 23 Javascript
jQuery leonaScroll 1.1 自定义滚动条插件(推荐)
Sep 17 Javascript
浅谈js基础数据类型和引用类型,深浅拷贝问题,以及内存分配问题
Sep 02 Javascript
JavaScript数组去重算法实例小结
May 07 Javascript
animate.css在vue项目中的使用教程
Aug 05 Javascript
如何自动化部署项目?折腾服务器之旅~
Apr 16 Javascript
Vue+Express实现登录状态权限验证的示例代码
May 05 Javascript
vue实现将数据存入vuex中以及从vuex中取出数据
Nov 08 Javascript
微信小程序如何获取用户头像和昵称
Sep 23 #Javascript
微信小程序使用蓝牙小插件
Sep 23 #Javascript
微信小程序实现蓝牙打印
Sep 23 #Javascript
微信接入之获取用户头像的方法步骤
Sep 23 #Javascript
从零搭一个自用的前端脚手架的方法步骤
Sep 23 #Javascript
layui 实现加载动画以及非真实加载进度的方法
Sep 23 #Javascript
layui加载数据显示loading加载完成loading消失的实例代码
Sep 23 #Javascript
You might like
php读取html并截取字符串的简单代码
2009/11/30 PHP
PHP设计模式之责任链模式的深入解析
2013/06/13 PHP
php 字符串中的\n换行符无效、不能换行的解决方法
2014/04/02 PHP
php实现水仙花数的4个示例分享
2014/04/08 PHP
js CSS操作方法集合
2008/10/31 Javascript
jQuery 使用手册(五)
2009/09/23 Javascript
基于jQuery的图片大小自动适应实现代码
2010/11/17 Javascript
cookie在javascript中的使用技巧以及隐私在服务器端的设置
2012/12/03 Javascript
浅谈angularjs中响应回车事件
2017/04/24 Javascript
Angular 4依赖注入学习教程之InjectToken的使用(八)
2017/06/04 Javascript
Javascript实现base64的加密解密方法示例
2017/06/27 Javascript
vue组件实现文字居中对齐的方法
2017/08/23 Javascript
jQuery实现滚动效果
2017/11/17 jQuery
JavaScript实现元素滚动条到达一定位置循环追加内容
2017/12/28 Javascript
JS实现为动态创建的元素添加事件操作示例
2018/03/17 Javascript
nodejs取得当前执行路径的方法
2018/05/13 NodeJs
angular2 NgModel模块的具体使用方法
2019/04/10 Javascript
微信小程序云开发之云函数详解
2019/05/16 Javascript
详解小程序横屏方案对比
2020/06/28 Javascript
[05:43]VG.R战队教练Mikasa专访:为目标从未停止战斗
2016/08/02 DOTA
[02:28]PWL开团时刻DAY3——Ink Ice与DeMonsTer之间的勾心斗角
2020/11/03 DOTA
使用python搭建Django应用程序步骤及版本冲突问题解决
2013/11/19 Python
解决python3 网络请求路径包含中文的问题
2018/05/10 Python
pandas 条件搜索返回列表的方法
2018/10/30 Python
利用pyshp包给shapefile文件添加字段的实例
2019/12/06 Python
Python3 pyecharts生成Html文件柱状图及折线图代码实例
2020/09/29 Python
python使用smtplib模块发送邮件
2020/12/17 Python
python中count函数知识点浅析
2020/12/17 Python
css3的图形3d翻转效果应用示例
2014/04/08 HTML / CSS
澳大利亚香水在线商店:City Perfume
2020/09/02 全球购物
理财投资建议书
2014/03/12 职场文书
企业党建工作汇报材料
2014/08/19 职场文书
好人好事新闻稿
2015/07/17 职场文书
秀!学妹看见都惊呆的Python小招数!【详细语言特性使用技巧】
2021/04/27 Python
Mysql官方性能测试工具mysqlslap的使用简介
2021/05/21 MySQL
Python开发五子棋小游戏
2022/04/28 Python