基于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 11 Javascript
基于javascript实现最简单的选项卡切换效果
May 16 Javascript
JS模拟实现方法重载示例
Aug 03 Javascript
JS中作用域和变量提升(hoisting)的深入理解
Oct 31 Javascript
webpack实现热更新(实施同步刷新)
Jul 28 Javascript
redux中间件之redux-thunk的具体使用
Apr 17 Javascript
详解React native fetch遇到的坑
Aug 30 Javascript
js防抖和节流的深入讲解
Dec 06 Javascript
微信小程序五子棋游戏的棋盘,重置,对弈实现方法【附demo源码下载】
Feb 20 Javascript
Vue-input框checkbox强制刷新问题
Apr 18 Javascript
vue源码nextTick使用及原理解析
Aug 13 Javascript
vue整合百度地图显示指定地点信息
Apr 06 Vue.js
全面解析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
DOTA2 探索永无止境 玩家自创强悍插眼攻略
2020/04/20 DOTA
php中文本数据翻页(留言本翻页)
2006/10/09 PHP
用PHP中的 == 运算符进行字符串比较
2006/11/26 PHP
windows下安装php的memcache模块的方法
2015/04/07 PHP
Mac环境下php操作mysql数据库的方法分享
2015/05/11 PHP
php多文件打包下载的实例代码
2017/07/12 PHP
Yii2框架中一些折磨人的坑
2019/12/15 PHP
Laravel框架中队列和工作(Queues、Jobs)操作实例详解
2020/04/06 PHP
菜鸟javascript基础资料整理2
2010/12/06 Javascript
javascript设计模式 封装和信息隐藏(上)
2012/07/24 Javascript
JQUERY 实现窗口滚动搜索框停靠效果(类似滚动停靠)
2013/03/27 Javascript
最好用的省市二级联动 原生js实现你值得拥有
2013/09/22 Javascript
js 获取元素下面所有li的两种方法
2014/04/14 Javascript
JavaScript中的值是按值传递还是按引用传递问题探讨
2015/01/30 Javascript
jQuery实现产品对比功能附源码下载
2016/08/09 Javascript
Vue.js教程之计算属性
2016/11/11 Javascript
js es6系列教程 - 基于new.target属性与es5改造es6的类语法
2017/09/02 Javascript
jQuery中each方法的使用详解
2018/03/18 jQuery
js+canvas实现滑动拼图验证码功能
2018/03/26 Javascript
详解Vue项目中实现锚点定位
2019/04/24 Javascript
解决vue.js提交数组时出现数组下标的问题
2019/11/05 Javascript
JavaScript 链表定义与使用方法示例
2020/04/28 Javascript
VUE使用 wx-open-launch-app 组件开发微信打开APP功能
2020/08/11 Javascript
python 打印出所有的对象/模块的属性(实例代码)
2016/09/11 Python
Python的SimpleHTTPServer模块用处及使用方法简介
2018/01/22 Python
django中send_mail功能实现详解
2018/02/06 Python
pytorch forward两个参数实例
2020/01/17 Python
PyQt5.6+pycharm配置以及pyinstaller生成exe(小白教程)
2020/06/02 Python
使用SimpleITK读取和保存NIfTI/DICOM文件实例
2020/07/01 Python
html5 桌面提醒:Notifycations应用介绍
2012/11/27 HTML / CSS
香港家用健身器材、运动器材及健康美容仪器专门店:FitBoxx
2019/12/05 全球购物
C++面试题目
2013/06/25 面试题
住宅质量保证书
2014/04/29 职场文书
计生办班子群众路线教育实践活动个人对照检查材料思想汇报
2014/10/04 职场文书
统计员岗位职责
2015/02/11 职场文书
SpringCloud Alibaba项目实战之nacos-server服务搭建过程
2021/06/21 Java/Android