最近一个小站，添加了QQ在线聊天功能，代码是复制QQ官方提供的代码。添加后功能是正常的，就是HTTPS的安全图标消失，出现的原因是加载了非https的图片元素。
QQ代码如下
<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=24813799&site=qq&menu=yes"><img border="0" src="http://wpa.qq.com/pa?p=2:114026000:51" alt="点击这里给我发消息" title="点击这里给我发消息"/></a>
通过代码看加载一个图片元素 http://wpa.qq.com/pa?p=2:24813799:51 , 修改为 https://wpa.qq.com/pa?p=2:114026000:51 依然没有解决。但是功能依然正常。
问题的原因是
curl -i https://wpa.qq.com/pa?p=2:24813799:51
HTTP/1.1 301 Moved Permanently
Date: Fri, 03 Feb 2017 03:34:18 GMT
Content-Type: text/html; charset=UTF-8
Transfer-Encoding: chunked
Connection: keep-alive
Server: tws
Location: http://pub.idqqimg.com/qconn/wpa/button/button_111.gif
Pragma: no-cache
Cache-Control: no-cache; must-revalidate
倒数第三行可以看到， 进行了重定向。 实际加载的元素是 http://pub.idqqimg.com/qconn/wpa/button/button_111.gif, 这个元素不是通过https进行加载的，所有安全的https小图标消失了。
解决办法办法
直接使用 https://pub.idqqimg.com/qconn/wpa/button/button_111.gif
完整的代码
<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=24813799&site=qq&menu=yes"><img border="0" src="https://pub.idqqimg.com/qconn/wpa/button/button_111.gif" alt="点击这里给我发消息" title="点击这里给我发消息"/></a>