Weixin API -- 微信js接口
今天在开发项目的时候,由于需要在微信中实现分享功能(分享成功后实现页面跳转并记录)。问度娘,找了很久,终于找到一个不错的方法。收藏起来以后备用,也希望对大家有所帮助!
在github的地址:https://github.com/maxzhang/WeixinAPI
我能做什么?
分享到微信朋友圈、微信好友或腾讯微博
调用微信客户端的图片播放组件
获取当前的网络状态
隐藏/显示右上角的菜单入口
隐藏/显示底部浏览器工具栏
关闭当前WebView页面
DEMO
微信扫描下面二维码查看例子:
API
1、API初始化
WeixinAPI 初始化,是后续所有 WeixinAPI 操作的起始,调用方法:
var wxData = { 'appId': '', // 服务号可以填写appId,没有则留空
'imgUrl': '', // 分享显示的图标
'link': 'http://maxzhang.github.io', // 分享链接
'title': '大家好,我是cyt静风', // 分享标题
'desc': '大家好,我是cyt静风' // 分享内容};
WeixinAPI.ready(wxData);
你可以在ready动作之后的任何时候更改wxData对象,比如:
wxData.link = 'http://www.75team.com';
2、分享事件监听
支持的事件名称:
ready准备分享cancel取消分享ok分享成功fail分享失败complete分享结束
默认事件监听应用到全局,不论哪个分享渠道都会执行回调函数。调用方法:
WeixinAPI.on('ok', function() { alert('share success!'); });
WeixinAPI.on('fail', function() { alert('share failure!'); });
注:最新版本微信已经不再区分分享动作,分享只响应统一的"general_share"动作,以下接口只有在微信5.4以下版本才有效
除此之外,你还可监听特定动作的事件,支持:
timeline朋友圈appmessage微信朋友weibo腾讯微博
调用方法:
WeixinAPI.on('timeline:ok', function() { alert('share timeline success!'); });
WeixinAPI.on('timeline:fail', function() { alert('share timeline failure!'); });
3、移除事件监听
调用方法:
function callback() {}
WeixinAPI.on('ok', callback);
WeixinAPI.off('ok', callback); // 取消监听
也可以一次性移除所有监听,调用方法:
WeixinAPI.off('ok');
4、调用微信客户端的图片播放组件
调用方法:
// 需要播放的图片url列表var urls = ['url1', 'url1', ..., 'urlN'];// 选一个作为当前展示的图片urlvar current = 'url'; WeixinAPI.imagePreview(current, urls);
5、获取当前的网络状态
Network 类型取值:
network_type:wifiwifi网络network_type:edge非wifi,包含3G/2Gnetwork_type:fail网络断开连接network_type:wwan2g或者3gunknow未知网络
调用方法:
// 同步调用,30秒同步一次 WeixinJSBridge 返回的网络状态,所以会有误差
2 var networkType = WeixinAPI.getNetworkType();// 异步调用,能获取精确的网络状态
3 WeixinAPI.getNetworkType(function(networkType) {
4 alert(networkType);
});
6、隐藏/显示右上角的菜单入口
调用方法:
WeixinAPI.showOptionMenu();
WeixinAPI.hideOptionMenu();
7、隐藏/显示底部浏览器工具栏,仅对公众号页面有效
调用方法:
WeixinAPI.showToolbar();
WeixinAPI.hideToolbar();
8、关闭当前WebView页面
调用方法:
WeixinAPI.closeWindow();
Weixin API -- 微信js接口的更多相关文章
- 微信JS接口
微信JS接口 分享到朋友圈 分享给朋友 分享到QQ 拍照或从手机相册中选图 识别音频并返回识别结果 使用微信内置地图查看位置来源:http://www.cnblogs.com/txw1958/p/ ...
- 微信JS接口汇总及使用详解
这篇文章主要介绍了微信JS接口汇总及使用详解,十分的全面.详尽,包含分享到朋友圈,分享给朋友,分享到QQ,拍照或从手机相册中选图,识别音频并返回识别结果,使用微信内置地图查看位置等接口,有需要的小伙伴 ...
- md笔记——微信JS接口
微信js接口 隐藏微信中网页右上角按钮 document.addEventListener('WeixinJSBridgeReady', function onBridgeReady() { Weix ...
- 使用微信js接口的方法 ,以调用相机为例
protected string GetTimeStamp_Str=""; protected string nonceStr_Str = ""; protec ...
- 微信js接口自定义分享内容
最近客户有个要求,需要给网页添加微信分享功能,当然指的是用微信自带浏览器的时候,希望用户在最后一页点击分享的时候是分享的首页.曾经无意中看到过微信公众开发者平台提供了js接口,所以试着做了做,果然,跌 ...
- 关于微信js接口调用时,token效期问题
如果一个应用的不同模块分配两个独立的公众号微官网使用,这时调用JS接口生成的token一定就冲突,原因是,token的有效期为两个小时. 解决方案: 将两个公众号的APPID与SERVERID分给不同 ...
- 微信支付配置信息,JSAPI接口,H5调用微信js接口支付,微信公众号支付
微信支付已经做完了,没接触过微信的我,经历了非常艰难的3天,才把微信支付给做出来,对于专业的人来说,估计就是一小时就搞定的事情了,虽然说做了很长时间,但是确实也学到东西了,也收获了不少,下面跟大家分享 ...
- 微信JS SDK配置授权,实现分享接口
微信开放的JS-SDK面向网页开发者提供了基于微信内的网页开发工具包,最直接的好处就是我们可以使用微信分享.扫一扫.卡券.支付等微信特有的能力.7月份的时候,因为这个分享的证书获取问题深深的栽了一坑, ...
- 微信js SDK接口
微信JS-SDK说明文档 http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html 一.微信登录功能 在进行微信OAut ...
随机推荐
- 初见微服务之RESTful API
1. REST名称由来 REST全称为Representational State Transfer,即表述性状态转移,最早由Roy Feilding博士在世纪之交(2000年)提出,喜欢追根溯源的朋 ...
- IOS 绘制条纹背景
@interface NJViewController () @property (weak, nonatomic) IBOutlet UITextView *contentView; - (IBAc ...
- 【洛谷4884】多少个1?(BSGS)
点此看题面 大致题意: 求满足\(个111...111(N\text{个}1)\equiv K(mod\ m)\)的最小\(N\). 题目来源 这题是洛谷某次极不良心的月赛的\(T1\),当时不会\( ...
- @TransactionConfiguration过时与替代写法
在使用了Spring的项目中做单元测试时,以前的标准写法是这样的: 但是在高版本的Spring框架中(Spring4.2以后),@TransactionConfiguration已经标注为过时的注解, ...
- 切换Ubuntu超级管理员
对Ubuntu进行拷贝命令时,如果不是root用户,会出现权限不足的情况,无法操作
- BZOJ3679: 数字之积(数位dp)
题意 题目链接 Sol 推什么结论啊. 直接大力dp,$f[i][j]$表示第$i$位,乘积为$j$,第二维直接开map 能赢! /* */ #include<iostream> #inc ...
- zabbix 密码忘记了如何恢复
1.进入数据库 2.使用zabbix的数据库 use zabbix: 3.查看表信息 show tables; 4.搜索users表 select * from users; 5.修改userid为1 ...
- 微信小游戏 demo 飞机大战 代码分析 (二)(databus.js)
微信小游戏 demo 飞机大战 代码分析(二)(databus.js) 微信小游戏 demo 飞机大战 代码分析(一)(main.js) 微信小游戏 demo 飞机大战 代码分析(三)(spirit. ...
- react与微信小程序
由组员完成 原文链接 都说react和微信小程序很像,但是像在什么部分呢,待我稍作对比. 生命周期 1.React React的生命周期在16版本以前与之后发生了重大变化,原因在于引入的React F ...
- 老男孩Python全栈第2期+课件笔记【高清完整92天整套视频教程】
点击了解更多Python课程>>> 老男孩Python全栈第2期+课件笔记[高清完整92天整套视频教程] 课程目录 ├─day01-python 全栈开发-基础篇 │ 01 pyth ...