Recently a small site, added QQ online chat function, the code is to copy the official QQ code provided. The only thing that works is that the HTTPS security icon disappears, and the reason for this is that non-https image elements are loaded.
<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=xxxx&site=qq&menu=yes"><img border="0" src="http://wpa.qq.com/pa?p=2:114026000:51" alt="点击这里给我发消息" title="点击这里给我发消息"/></a>
Looking at the code to load an image element http://wpa.qq.com/pa?p=2:24813799:51 , and changing it to https://wpa.qq.com/pa?p=2:114026000:51 still doesn't solve the problem. But it still works.
The reason for the problem is
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
As you can see in the third last line, a redirect was performed. The actual element that was loaded was http://pub.idqqimg.com/qconn/wpa/button/button_111.gif, this element was not loaded via https, and all the little secure https icons disappeared.
Solution approach
Direct access to https://pub.idqqimg.com/qconn/wpa/button/button_111.gif
Complete Code
<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=xxxxxx&site=qq&menu=yes"><img border="0" src="https://pub.idqqimg.com/qconn/wpa/button/button_111.gif" alt="点击这里给我发消息" title="点击这里给我发消息"/></a>