基于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 相关文章推荐
newxtree.js代码
Mar 13 Javascript
JQuery筛选器全系列介绍
Aug 27 Javascript
JavaScript中的null和undefined区别介绍
Jan 01 Javascript
基于javascript实现根据身份证号码识别性别和年龄
Jan 22 Javascript
基于jQuery实现收缩展开功能
Mar 18 Javascript
Bootstrap的popover(弹出框)在append后弹不出(失效)
Feb 27 Javascript
element vue validate验证名称重复 输入框与后台重复验证 特殊字符 字符长度 及注意事项小结【实例代码】
Nov 20 Javascript
js实现随机div颜色位置 类似满天星效果
Oct 24 Javascript
JS 5种遍历对象的方式
Jun 16 Javascript
在vs code 中如何创建一个自己的 Vue 模板代码
Nov 10 Javascript
vue实现抽屉弹窗效果
Nov 15 Javascript
three.js显示中文字体与tween应用详析
Jan 04 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下关于中英数字混排的字符串分割问题
2010/04/06 PHP
解析CI的AJAX分页 另类实现方法
2013/06/27 PHP
让codeigniter与swfupload整合的最佳解决方案
2014/06/12 PHP
php一个文件搞定微信jssdk配置
2016/12/12 PHP
利用PHP获取汉字首字母并且分组排序详解
2017/10/22 PHP
TP5框架实现自定义分页样式的方法示例
2020/04/05 PHP
js的with语句使用方法
2007/09/21 Javascript
javascript 跳转代码集合
2009/12/03 Javascript
JavaScript异步调用定时方法并停止该方法实现代码
2012/03/16 Javascript
Javascript学习笔记之 函数篇(一) : 函数声明和函数表达式
2014/06/24 Javascript
纯css实现窗户玻璃雨滴逼真效果
2015/08/23 Javascript
jquery点击展示与隐藏更多内容
2016/12/03 Javascript
详解ES6中的let命令
2020/04/05 Javascript
js实现随机抽选效果、随机抽选红色球效果
2017/01/13 Javascript
JavaScript实现简单评论功能
2017/08/17 Javascript
js统计页面上每个标签的数量实例代码
2018/05/29 Javascript
js canvas实现写字动画效果
2018/11/30 Javascript
jQuery实现带3D切割效果的轮播图功能示例【附源码下载】
2019/04/04 jQuery
vue axios封装及API统一管理的方法
2019/04/18 Javascript
Vue 指令实现按钮级别权限管理功能
2019/04/23 Javascript
vue.js路由mode配置之去掉url上默认的#方法
2019/11/01 Javascript
Vue 路由间跳转和新开窗口的方式(query、params)
2019/12/25 Javascript
[01:09]模型精美,特效酷炫!TI9不朽宝藏Ⅰ鉴赏
2019/05/10 DOTA
Python求解平方根的方法
2015/03/11 Python
python常规方法实现数组的全排列
2015/03/17 Python
Python的Flask框架中SQLAlchemy使用时的乱码问题解决
2015/11/07 Python
Python cookbook(数据结构与算法)根据字段将记录分组操作示例
2018/03/19 Python
替换python字典中的key值方法
2018/07/06 Python
python列表使用实现名字管理系统
2019/01/30 Python
工艺工程师工作职责
2013/11/23 职场文书
《花木兰》教学反思
2014/04/09 职场文书
媒矿安全生产承诺书
2014/05/23 职场文书
中层领导干部群众路线对照检查材料思想汇报
2014/10/02 职场文书
民主评议党员自我鉴定
2014/10/21 职场文书
十二月早安励志心语大全
2019/12/03 职场文书
Win11 S Mode版本泄露 正式上线后叫做Windows 11 SE
2021/11/21 数码科技