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

 更新时间:2015年11月30日 11:15:28   投稿:mrr  
微信浏览器内置了javascript私有对象WeixinJSBridge,可以实现发送给朋友、分享到朋友圈、分享到微博等功能,本篇文章给大家介绍基于js实现微信发送给朋友如何分享到朋友圈、微博,感兴趣的朋友一起学习吧

微信浏览器内置了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'){
  //关注成功,或者已经关注过
 }
 })
}

相关文章

  • 信息滚动效果的实例讲解

    信息滚动效果的实例讲解

    下面小编就为大家带来一篇信息滚动效果的实例讲解。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-09-09
  • 详解用webpack把我们的业务模块分开打包的方法

    详解用webpack把我们的业务模块分开打包的方法

    本篇文章主要介绍了用webpack把我们的业务模块分开打包的方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-07-07
  • 原生javascript实现图片轮播切换效果

    原生javascript实现图片轮播切换效果

    这篇文章主要为大家详细介绍了原生javascript实现图片轮播切换效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-07-07
  • js在数组中删除重复的元素自保留一个(两种实现思路)

    js在数组中删除重复的元素自保留一个(两种实现思路)

    遍历要删除的数组arr, 把元素分别放入另一个数组tmp中,在判断该元素在arr中不存在才允许放入tmp中,具体实现如下,需要的朋友可以看看
    2014-08-08
  • 详谈JavaScript内存泄漏

    详谈JavaScript内存泄漏

    文章从什么是闭包、以及闭包所涉及的作用域链说起,讲述了JavaScript垃圾回收机制、循环引用、循环引用和闭包、IE中的内存泄漏以及解决方法,是篇非常详尽,非常不错的文章,这里推荐给大家。
    2014-11-11
  • 关于微信小程序自定义tabbar问题详析

    关于微信小程序自定义tabbar问题详析

    微信小程序是一种全新的连接用户与服务的方式,它可以在微信内被便捷地获取和传播,同时具有出色的使用体验,下面这篇文章主要给大家介绍了关于微信小程序自定义tabbar问题的相关资料,需要的朋友可以参考下
    2022-04-04
  • javascript利用键盘控制小方块的移动

    javascript利用键盘控制小方块的移动

    这篇文章主要为大家详细介绍了javascript利用键盘控制小方块的移动,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2020-04-04
  • js获取元素的外链样式的简单实现方法

    js获取元素的外链样式的简单实现方法

    下面小编就为大家带来一篇js获取元素的外链样式的简单实现方法。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-06-06
  • 微信小程序路由跳转两种方式示例解析

    微信小程序路由跳转两种方式示例解析

    这篇文章主要为大家介绍了微信小程序路由跳转两种方式示例解析,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步早日升职加薪
    2022-04-04
  • js 执行上下文和作用域的相关总结

    js 执行上下文和作用域的相关总结

    这篇文章主要介绍了js 执行上下文和作用域的相关知识总结,帮助大家更好的理解和使用JavaScript,感兴趣的朋友可以了解下
    2021-02-02

最新评论