微信公众平台前端开发技巧分享

微信公众平台
微信公众平台

新版微信做了更改,此文提到的部分方法可能已经不再适用,请关注微信官方开放平台:http://open.weixin.qq.com/document/?lang=zh_CN

微信很火,微信推出的公众平台也吸引了一部分市场宣传推广团队,像冷笑话大全这种微博养粉大户在微信的公众平台也是异常火爆。

因工作需求,最近为我们的市场部做了几个微信公共平台下的页面,其中涉及微信公众账号的友情链接,转发一篇文章到微信朋友圈,判断是否转发成功的回调机制,判断是否成功关注微信帐号等的前端代码,我也是通过分析冷笑话大全的页面找到的方法,也google过,但没找到微信官方有公布过相关文档,所以就把自己知道的拿来分享一下。

微信内嵌浏览器:

微信内嵌浏览器有一个私有JS 对象:WeixinJSBridge,通过操作这个对象的相关方法可以实现转发链接到微信朋友圈,和判断一个微信号的关注状态,比如在进行转发抽奖的活动时,判断是否转发成功和是否关注成功会很有必要。

转发链接到朋友圈:

//点击事件调用此函数即可激发一次转发到朋友圈操作
function toWexinFriends(){

	WeixinJSBridge.invoke('shareTimeline',{
		"img_url": "http://example.com/example.png",
		//"img_width": "640",
		//"img_height": "640",
		"link": "http://example.com",
		"desc": "描述",
		"title": "标题"
	},function(res){
		// 返回res.err_msg,取值
		// share_timeline:cancel 用户取消
		// share_timeline:fail 发送失败
		// share_timeline:confirm 发送成功
		WeixinJSBridge.log(res.err_msg);

		if(res.err_msg == 'share_timeline:confirm'){
			//转发成功
		};
	});

}

关注微信公众帐号:


function addFirend(){

//gh_122a2ee67fae 为被添加者的微信ID

WeixinJSBridge.invoke("addContact", {webtype: "1",username: 'gh_122a2ee67fae'}, function(e) {
			WeixinJSBridge.log(e.err_msg);
			//e.err_msg:add_contact:added 已经添加
			//e.err_msg:add_contact:cancel 取消添加
			//e.err_msg:add_contact:ok 添加成功
			if(e.err_msg == 'add_contact:added' || e.err_msg == 'add_contact:ok'){
				//关注成功,或者已经关注过
			}
		})
}

以上都需要在微信内嵌浏览器内才能被识别,通过判断WeixinJSBridge对象是否存在,可以知道是否在微信内浏览的页面。

微信内嵌浏览器还可以识别:

<a href="weixin://profile/gh_122a2ee67fae"></a>

此种类型的链接,此链接在微信内会链接到一个公共帐号的介绍界面。
外部浏览器可以使用:

<a href="weixin://qr/aHUbFAjE_jaFhxl3nyBM"></a>

此种类型的链接在手机的外部浏览器也会被自动识别并跳转到微信,但会进行条码扫描,体验不是很好。

以上分享希望对大家有所帮助,更希望知情人士分享更多技巧,QQ的社交链真的是强大到可怕,微信已经渐渐成长壮大,必会成为网络营销的另一片沃土!

“微信公众平台前端开发技巧分享”的27个回复


  1. 此种类型的链接在手机的外部浏览器也会被自动识别并跳转到微信
    请问:aHUbFAjE_jaFhxl3nyBM是不是公众号一个标识码?如何获得公众号这个标识码?
    期望得到你回复:ant8090@qq.com

    1. 在微信网页版(wx.qq.com)可以获得,登录网页版,在想要获取标识码的用户头像上点击查看元素,有个叫 class=”chatListColumn” DIV 元素里就可以看到 un=”gh_122a2ee67fae” 这样的属相。

  2. 在微信网页版(wx.qq.com)可以获得,登录网页版,在想要获取标识码的用户头像上点击查看元素,有个叫 class=”chatListColumn” DIV 元素里就可以看到 un=”gh_122a2ee67fae” 这样的属相。

    我按照你的方法,并没有找到这个属性,aHUbFAjE_jaFhxl3nyBM这个到底怎么获得的。你能告诉我吗?gh_这个值我可以知道的。请你帮帮我。谢谢你。

  3. 博主你好,但愿你还有关注这个博客的评论

    菜鸟同求一实例,以便消化理解,期望得到你回复

    Email:331338391@qq.com

    Many thanks …

  4. 谢谢楼主分享
    我试了,weixin://qr/aHUbFAjE_jaFhxl3nyBM
    这个方法,跳转过去说我不存在此账号
    现在不能用这个方法了,那楼主知道现在可以用的方法嘛?

  5. 设置点击事件调用分享到朋友圈,但是经常点击后没有反应,除非先点微信右上角的分享到朋友圈,然后再返回到网页点击网页中的按钮才有反应。这是微信现在在故意屏蔽吗?

发表评论

电子邮件地址不会被公开。 必填项已用*标注