基于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 使用点滴函数代码
May 20 Javascript
JavaScript获取/更改文本框的值的实例代码
Aug 02 Javascript
javascript作用域问题实例分析
Jul 13 Javascript
js实现n秒倒计时后才可以点击的效果
Dec 20 Javascript
详述JavaScript实现继承的几种方式(推荐)
Mar 22 Javascript
浅谈如何实现easyui的datebox格式化
Jun 12 Javascript
推荐三款日期选择插件(My97DatePicker、jquery.datepicker、Mobiscroll)
Apr 21 jQuery
完美实现js拖拽效果 return false用法详解
Jul 28 Javascript
vue左侧菜单,树形图递归实现代码
Aug 24 Javascript
Vuex的基本概念、项目搭建以及入坑点
Nov 04 Javascript
3分钟了解vue数据劫持的原理实现
May 01 Javascript
mui js控制开关状态、修改switch开关的值方法
Sep 03 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 攻击方法之谈php+mysql注射语句构造
2009/10/30 PHP
php中替换字符串函数strtr()和str_repalce()的用法与区别
2016/11/25 PHP
Javascript 中的 &amp;&amp; 和 || 使用小结
2010/04/25 Javascript
JS实现下拉框的动态添加(附效果)
2013/04/03 Javascript
js验证是否为数字的总结
2013/04/14 Javascript
JS代码判断IE6,IE7,IE8,IE9的函数代码
2013/08/02 Javascript
js实现网页标题栏闪烁提示效果实例分析
2014/11/20 Javascript
谈一谈javascript中继承的多种方式
2016/02/19 Javascript
第二篇Bootstrap起步
2016/06/21 Javascript
bootstrap折叠调用collapse()后data-parent不生效的快速解决办法
2017/02/23 Javascript
VUE实现日历组件功能
2017/03/13 Javascript
利用node.js制作命令行工具方法教程(一)
2017/06/22 Javascript
html中通过JS获取JSON数据并加载的方法
2017/11/30 Javascript
jQuery easyui datagird编辑行删除行功能的实现代码
2018/09/20 jQuery
JS canvas绘制五子棋的棋盘
2020/05/28 Javascript
node.js实现为PDF添加水印的示例代码
2018/12/05 Javascript
D3.js(v3)+react 实现带坐标与比例尺的柱形图 (V3版本)
2019/05/09 Javascript
vue使用codemirror的两种用法
2019/08/27 Javascript
基于Vue实现微前端的示例代码
2020/04/24 Javascript
python常用web框架简单性能测试结果分享(包含django、flask、bottle、tornado)
2014/08/25 Python
Python中用pycurl监控http响应时间脚本分享
2015/02/02 Python
Python接收Gmail新邮件并发送到gtalk的方法
2015/03/10 Python
Python同时向控制台和文件输出日志logging的方法
2015/05/26 Python
简述:我为什么选择Python而不是Matlab和R语言
2017/11/14 Python
Python下调用Linux的Shell命令的方法
2018/06/12 Python
python3判断url链接是否为404的方法
2018/08/10 Python
Python3和PyCharm安装与环境配置【图文教程】
2020/02/14 Python
UNIONBAY官网:美国青少年服装品牌
2019/03/26 全球购物
T3官网:头发造型工具
2019/12/26 全球购物
土耳其新趋势女装购物网站:Addax
2020/01/07 全球购物
最热门的自我评价
2013/12/30 职场文书
建筑安全责任书范本
2014/07/24 职场文书
党员批评与自我批评(5篇)
2014/09/23 职场文书
创建文明城市倡议书
2015/04/28 职场文书
python程序的组织结构详解
2021/12/06 Python
SpringBoot详解执行过程
2022/07/15 Java/Android