基于js实现微信发送好友如何分享到朋友圈、微博


Posted in Javascript onNovember 30, 2015

微信浏览器内置了javascript私有对象WeixinJSBridge,可以实现发送给朋友、分享到朋友圈、分享到微博等功能。

<script>
  var imgUrl = "图片地址";
  var lineLink = "当前网址";
  var descContent = "描述";
  var shareTitle = '标题';
  var appid = '';
  function shareFriend() {
   WeixinJSBridge.invoke('sendAppMessage',{
    "appid": appid,
    "img_url": imgUrl,
    "img_width": "200",
    "img_height": "200",
    "link": lineLink,
    "desc": descContent,
    "title": shareTitle
   }, function(res) {
    //_report('send_msg', res.err_msg);
   })
  }
  function shareTimeline() {
   WeixinJSBridge.invoke('shareTimeline',{
    "img_url": imgUrl,
    "img_width": "200",
    "img_height": "200",
    "link": lineLink,
    "desc": descContent,
    "title": shareTitle
   }, function(res) {
     //_report('timeline', res.err_msg);
   });
  }
  function shareWeibo() {
   WeixinJSBridge.invoke('shareWeibo',{
    "content": descContent,
    "url": lineLink,
   }, function(res) {
    //_report('weibo', res.err_msg);
   });
  }
  // 当微信内置浏览器完成内部初始化后会触发WeixinJSBridgeReady事件。
  document.addEventListener('WeixinJSBridgeReady', function onBridgeReady() {
   // 发送给好友
   WeixinJSBridge.on('menu:share:appmessage', function(argv){
    shareFriend();
   });
   // 分享到朋友圈
   WeixinJSBridge.on('menu:share:timeline', function(argv){
    shareTimeline();
   });
   // 分享到微博
   WeixinJSBridge.on('menu:share:weibo', function(argv){
    shareWeibo();
   });
  }, false);
</script>

在微信公众平台前端网页上添加分享到朋友圈,关注微信等按钮

微信公众平台开始支持前端网页,大家可能看到很多网页上都有分享到朋友圈,关注微信等按钮,点击它们都会弹出一个窗口让你分享和关注,这个是怎么实现的呢?今天就给大家讲解下如何在微信公众平台前端网页上添加分享到朋友圈,关注微信号等按钮。

微信内嵌浏览器

通过 Mac 远程调试 iPhone 上微信自己的网页,我们可以发现微信内嵌浏览器定义了一个私有 JavaScript 对象:WeixinJSBridge,通过操作这个对象的相关方法可以实现分享到微信朋友圈,和判断一个微信号的关注状态以及实现关注指定微信号等功能。

分享到朋友圈

function weixinShareTimeline(title,desc,link,imgUrl){
 WeixinJSBridge.invoke('shareTimeline',{
 "img_url":imgUrl,
 //"img_width":"640",
 //"img_height":"640",
 "link":link,
 "desc": desc,
 "title":title
 }); 
}

发送给好友

function weixinSendAppMessage(title,desc,link,imgUrl){
 WeixinJSBridge.invoke('sendAppMessage',{
 //"appid":appId,
 "img_url":imgUrl,
 //"img_width":"640",
 //"img_height":"640",
 "link":link,
 "desc":desc,
 "title":title
 });
}

分享到腾讯微博

function weixinShareWeibo(title,link){
 WeixinJSBridge.invoke('shareWeibo',{
 "content":title + link,
 "url":link
 });
}

关注指定的微信号

function weixinAddContact(name){
 WeixinJSBridge.invoke("addContact", {webtype: "1",username: name}, 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'){
  //关注成功,或者已经关注过
 }
 })
}
Javascript 相关文章推荐
jquery.boxy弹出框(后隔N秒后自动隐藏/自动跳转)
Jan 15 Javascript
css配合jquery美化 select
Nov 29 Javascript
js 数值转换为3位逗号分隔的示例代码
Feb 19 Javascript
浅谈JavaScript Array对象
Dec 29 Javascript
jQuery继承extend用法详解
Oct 10 Javascript
jQuery+json实现动态创建复杂表格table的方法
Oct 25 Javascript
谈谈JS中常遇到的浏览器兼容问题和解决方法
Dec 17 Javascript
Web前端框架Angular4.0.0 正式版发布
Mar 28 Javascript
详解JavaScript基础知识(JSON、Function对象、原型、引用类型)
Jan 16 Javascript
原生js实现Flappy Bird小游戏
Dec 24 Javascript
Vue实现省市区三级联动
Dec 27 Vue.js
js前端设计模式优化50%表单校验代码示例
Jun 21 Javascript
全面解析Bootstrap排版使用方法(文字样式)
Nov 30 #Javascript
javascript中eval和with用法实例总结
Nov 30 #Javascript
JavaScript基础篇(3)之Object、Function等引用类型
Nov 30 #Javascript
全面解析Bootstrap排版使用方法(标题)
Nov 30 #Javascript
javascript作用域链(Scope Chain)用法实例解析
Nov 30 #Javascript
Bootstrap每天必学之js插件
Nov 30 #Javascript
Bootstrap每天必学之面板
Nov 30 #Javascript
You might like
PHP无限分类的类
2007/01/02 PHP
PHP实现根据银行卡号判断银行
2015/04/29 PHP
PHP实现微信图片上传到服务器的方法示例
2017/06/29 PHP
php实现的AES加密类定义与用法示例
2018/01/29 PHP
js 获取浏览器高度和宽度值(多浏览器)
2009/09/02 Javascript
JQury slideToggle闪烁问题及解决办法
2011/07/05 Javascript
JavaScript+CSS控制打印格式示例介绍
2014/01/07 Javascript
javascript类型转换示例
2014/04/29 Javascript
浅谈JSON和JSONP区别及jQuery的ajax jsonp的使用
2014/11/23 Javascript
jQuery实现首页顶部可伸缩广告特效代码
2015/04/15 Javascript
js倒计时抢购实例
2015/12/20 Javascript
Angularjs中的验证input输入框只能输入数字和小数点的写法(推荐)
2017/08/16 Javascript
vue2.0学习之axios的封装与vuex介绍
2018/05/28 Javascript
微信实现自动跳转到用其他浏览器打开指定APP下载
2019/02/15 Javascript
了解JavaScript中的选择器
2019/05/24 Javascript
监控微信小程序中的慢HTTP请求过程详解
2019/07/05 Javascript
Vue实现商品飞入购物车效果(电商项目)
2019/11/26 Javascript
d3.js实现图形拖拽
2019/12/19 Javascript
浅析vue cli3 封装Svgicon组件正确姿势(推荐)
2020/04/27 Javascript
详解vue中在父组件点击按钮触发子组件的事件
2020/11/13 Javascript
[47:36]Optic vs Newbee 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/18 DOTA
python获得图片base64编码示例
2014/01/16 Python
Python深入06——python的内存管理详解
2016/12/07 Python
高效测试用例组织算法pairwise之Python实现方法
2017/07/19 Python
详解爬虫被封的问题
2019/04/23 Python
详解python编译器和解释器的区别
2019/06/24 Python
基于Python爬取京东双十一商品价格曲线
2020/10/23 Python
Html5应用程序缓存(Cache manifest)
2018/06/04 HTML / CSS
中专生的个人自我评价
2013/12/11 职场文书
销售工作岗位职责
2013/12/24 职场文书
投标邀请书范文
2014/01/31 职场文书
高中英语教学反思
2014/02/04 职场文书
文艺演出策划方案
2014/06/07 职场文书
财会专业毕业生自荐信
2014/07/09 职场文书
党员评议思想汇报
2014/10/08 职场文书
2014年体育工作总结
2014/11/24 职场文书