微信朋友圈内嵌WebView,可以理解成一个浏览器。
所以,任何可访问网页都能在朋友圈打开、分享,就非常容易理解了。
微信的WebView内有一些自带特性,如WeixinJSBridge对象,可以定制一些特性。
最简单的情况,我们写一个可以访问的网页(带服务器的),把url复制到微信中发送给任何人,点击url就可以打开这个网页。但是url如果不是域名是ip地址会提示是否继续访问。
通过微信打开的网页,头部会带有分享等功能。分享到朋友圈,发送给特定人后,url变好看了,微信做了处理和提取。
最重要的,图片和文字是怎么来的?
微信的提取机制
图片:从body开始找到第一个像素大于300×300,显示着的图片。
文字:html中title里内容。
为了让图片更符合微信气息,专门为微信准备一个图片更好,又不能隐藏,聪明的你早就想到了,把图片这样设置:
<img style="height: 0; 0;" src="wechatIcon.jpg">
开发调试
开发微信网页可以使用微信web开发者工具来调试,看效果。开发者工具主要继承了Chrome开发者工具,加微信自有特性。
但微信有个限制:地址要使用域名而不能使用ip。开发者工具不识别ip地址,微信的webView也不识别,只能查看静态效果。