/**!
* 微信内置浏览器的Javascript API,功能包括:
*
* 1、分享到微信朋友圈
* 2、分享给微信好友
* 3、分享到腾讯微博
* 4、新的分享接口,包含朋友圈、好友、微博的分享(for iOS)
* 5、隐藏/显示右上角的菜单入口
* 6、隐藏/显示底部浏览器工具栏
* 7、获取当前的网络状态
* 8、调起微信客户端的图片播放组件
* 9、关闭公众平台Web页面
* 10、判断当前网页是否在微信内置浏览器中打开
* 11、增加打开扫描二维码
* 12、支持WeixinApi的错误监控
* 13、检测应用程序是否已经安装(需要官方开通权限)
*
* @author zhaoxianlie(http://www.baidufe.com)
*/
var WeixinApi = (function () { "use strict"; /**
* 分享到微信朋友圈
* @param {Object} data 待分享的信息
* @p-config {String} appId 公众平台的appId(服务号可用)
* @p-config {String} imgUrl 图片地址
* @p-config {String} link 链接地址
* @p-config {String} desc 描述
* @p-config {String} title 分享的标题
*
* @param {Object} callbacks 相关回调方法
* @p-config {Boolean} async ready方法是否需要异步执行,默认false
* @p-config {Function} ready(argv) 就绪状态
* @p-config {Function} dataLoaded(data) 数据加载完成后调用,async为true时有用,也可以为空
* @p-config {Function} cancel(resp) 取消
* @p-config {Function} fail(resp) 失败
* @p-config {Function} confirm(resp) 成功
* @p-config {Function} all(resp) 无论成功失败都会执行的回调
*/
function weixinShareTimeline(data, callbacks) {
callbacks = callbacks || {};
var shareTimeline = function (theData) {
WeixinJSBridge.invoke('shareTimeline', {
"appid":theData.appId ? theData.appId : '',
"img_url":theData.imgUrl,
"link":theData.link,
"desc":theData.title,
"title":theData.desc, // 注意这里要分享出去的内容是desc
"img_width":"640",
"img_height":"640"
}, function (resp) {
switch (resp.err_msg) {
// share_timeline:cancel 用户取消
case 'share_timeline:cancel':
callbacks.cancel && callbacks.cancel(resp);
break;
// share_timeline:confirm 发送成功
case 'share_timeline:confirm':
case 'share_timeline:ok':
callbacks.confirm && callbacks.confirm(resp);
break;
// share_timeline:fail 发送失败
case 'share_timeline:fail':
default:
callbacks.fail && callbacks.fail(resp);
break;
}
// 无论成功失败都会执行的回调
callbacks.all && callbacks.all(resp);
});
};
WeixinJSBridge.on('menu:share:timeline', function (argv) {
if (callbacks.async && callbacks.ready) {
window["_wx_loadedCb_"] = callbacks.dataLoaded || new Function();
if(window["_wx_loadedCb_"].toString().indexOf("_wx_loadedCb_") > 0) {
window["_wx_loadedCb_"] = new Function();
}
callbacks.dataLoaded = function (newData) {
window["_wx_loadedCb_"](newData);
shareTimeline(newData);
};
// 然后就绪
callbacks.ready && callbacks.ready(argv);
} else {
// 就绪状态
callbacks.ready && callbacks.ready(argv);
shareTimeline(data);
}
});
} /**
* 发送给微信上的好友
* @param {Object} data 待分享的信息
* @p-config {String} appId 公众平台的appId(服务号可用)
* @p-config {String} imgUrl 图片地址
* @p-config {String} link 链接地址
* @p-config {String} desc 描述
* @p-config {String} title 分享的标题
*
* @param {Object} callbacks 相关回调方法
* @p-config {Boolean} async ready方法是否需要异步执行,默认false
* @p-config {Function} ready(argv) 就绪状态
* @p-config {Function} dataLoaded(data) 数据加载完成后调用,async为true时有用,也可以为空
* @p-config {Function} cancel(resp) 取消
* @p-config {Function} fail(resp) 失败
* @p-config {Function} confirm(resp) 成功
* @p-config {Function} all(resp) 无论成功失败都会执行的回调
*/
function weixinSendAppMessage(data, callbacks) {
callbacks = callbacks || {};
var sendAppMessage = function (theData) {
WeixinJSBridge.invoke('sendAppMessage', {
"appid":theData.appId ? theData.appId : '',
"img_url":theData.imgUrl,
"link":theData.link,
"desc":theData.desc,
"title":theData.title,
"img_width":"640",
"img_height":"640"
}, function (resp) {
switch (resp.err_msg) {
// send_app_msg:cancel 用户取消
case 'send_app_msg:cancel':
callbacks.cancel && callbacks.cancel(resp);
break;
// send_app_msg:confirm 发送成功
case 'send_app_msg:confirm':
case 'send_app_msg:ok':
callbacks.confirm && callbacks.confirm(resp);
break;
// send_app_msg:fail 发送失败
case 'send_app_msg:fail':
default:
callbacks.fail && callbacks.fail(resp);
break;
}
// 无论成功失败都会执行的回调
callbacks.all && callbacks.all(resp);
});
};
WeixinJSBridge.on('menu:share:appmessage', function (argv) {
if (callbacks.async && callbacks.ready) {
window["_wx_loadedCb_"] = callbacks.dataLoaded || new Function();
if(window["_wx_loadedCb_"].toString().indexOf("_wx_loadedCb_") > 0) {
window["_wx_loadedCb_"] = new Function();
}
callbacks.dataLoaded = function (newData) {
window["_wx_loadedCb_"](newData);
sendAppMessage(newData);
};
// 然后就绪
callbacks.ready && callbacks.ready(argv);
} else {
// 就绪状态
callbacks.ready && callbacks.ready(argv);
sendAppMessage(data);
}
});
} /**
* 分享到腾讯微博
* @param {Object} data 待分享的信息
* @p-config {String} link 链接地址
* @p-config {String} desc 描述
*
* @param {Object} callbacks 相关回调方法
* @p-config {Boolean} async ready方法是否需要异步执行,默认false
* @p-config {Function} ready(argv) 就绪状态
* @p-config {Function} dataLoaded(data) 数据加载完成后调用,async为true时有用,也可以为空
* @p-config {Function} cancel(resp) 取消
* @p-config {Function} fail(resp) 失败
* @p-config {Function} confirm(resp) 成功
* @p-config {Function} all(resp) 无论成功失败都会执行的回调
*/
function weixinShareWeibo(data, callbacks) {
callbacks = callbacks || {};
var shareWeibo = function (theData) {
WeixinJSBridge.invoke('shareWeibo', {
"content":theData.desc,
"url":theData.link
}, function (resp) {
switch (resp.err_msg) {
// share_weibo:cancel 用户取消
case 'share_weibo:cancel':
callbacks.cancel && callbacks.cancel(resp);
break;
// share_weibo:confirm 发送成功
case 'share_weibo:confirm':
case 'share_weibo:ok':
callbacks.confirm && callbacks.confirm(resp);
break;
// share_weibo:fail 发送失败
case 'share_weibo:fail':
default:
callbacks.fail && callbacks.fail(resp);
break;
}
// 无论成功失败都会执行的回调
callbacks.all && callbacks.all(resp);
});
};
WeixinJSBridge.on('menu:share:weibo', function (argv) {
if (callbacks.async && callbacks.ready) {
window["_wx_loadedCb_"] = callbacks.dataLoaded || new Function();
if(window["_wx_loadedCb_"].toString().indexOf("_wx_loadedCb_") > 0) {
window["_wx_loadedCb_"] = new Function();
}
callbacks.dataLoaded = function (newData) {
window["_wx_loadedCb_"](newData);
shareWeibo(newData);
};
// 然后就绪
callbacks.ready && callbacks.ready(argv);
} else {
// 就绪状态
callbacks.ready && callbacks.ready(argv);
shareWeibo(data);
}
});
} /**
* 新的分享接口
* @param {Object} data 待分享的信息
* @p-config {String} appId 公众平台的appId(服务号可用)
* @p-config {String} imgUrl 图片地址
* @p-config {String} link 链接地址
* @p-config {String} desc 描述
* @p-config {String} title 分享的标题
*
* @param {Object} callbacks 相关回调方法
* @p-config {Boolean} async ready方法是否需要异步执行,默认false
* @p-config {Function} ready(argv,shareTo) 就绪状态
* @p-config {Function} dataLoaded(data) 数据加载完成后调用,async为true时有用,也可以为空
* @p-config {Function} cancel(resp,shareTo) 取消
* @p-config {Function} fail(resp,shareTo) 失败
* @p-config {Function} confirm(resp,shareTo) 成功
* @p-config {Function} all(resp,shareTo) 无论成功失败都会执行的回调
*/
function weixinGeneralShare(data, callbacks) {
callbacks = callbacks || {};
var generalShare = function (general,theData) { // 如果是分享到朋友圈,则需要把title和desc交换一下
if(general.shareTo == 'timeline') {
var title = theData.title;
theData.title = theData.desc || title;
theData.desc = title;
} // 分享出去
general.generalShare({
"appid":theData.appId ? theData.appId : '',
"img_url":theData.imgUrl,
"link":theData.link,
"desc":theData.desc,
"title":theData.title,
"img_width":"640",
"img_height":"640"
}, function (resp) {
switch (resp.err_msg) {
// general_share:cancel 用户取消
case 'general_share:cancel':
callbacks.cancel && callbacks.cancel(resp ,general.shareTo);
break;
// general_share:confirm 发送成功
case 'general_share:confirm':
case 'general_share:ok':
callbacks.confirm && callbacks.confirm(resp ,general.shareTo);
break;
// general_share:fail 发送失败
case 'general_share:fail':
default:
callbacks.fail && callbacks.fail(resp ,general.shareTo);
break;
}
// 无论成功失败都会执行的回调
callbacks.all && callbacks.all(resp ,general.shareTo);
});
};
WeixinJSBridge.on('menu:general:share', function (general) {
if (callbacks.async && callbacks.ready) {
window["_wx_loadedCb_"] = callbacks.dataLoaded || new Function();
if(window["_wx_loadedCb_"].toString().indexOf("_wx_loadedCb_") > 0) {
window["_wx_loadedCb_"] = new Function();
}
callbacks.dataLoaded = function (newData) {
window["_wx_loadedCb_"](newData);
generalShare(general,newData);
};
// 然后就绪
callbacks.ready && callbacks.ready(general,general.shareTo);
} else {
// 就绪状态
callbacks.ready && callbacks.ready(general,general.shareTo);
generalShare(general,data);
}
});
} /**
* 加关注(此功能只是暂时先加上,不过因为权限限制问题,不能用,如果你的站点是部署在*.qq.com下,也许可行)
* @param {String} appWeixinId 微信公众号ID
* @param {Object} callbacks 回调方法
* @p-config {Function} fail(resp) 失败
* @p-config {Function} confirm(resp) 成功
*/
function addContact(appWeixinId,callbacks){
callbacks = callbacks || {};
WeixinJSBridge.invoke("addContact", {
webtype: "1",
username: appWeixinId
}, function (resp) {
var success = !resp.err_msg || "add_contact:ok" == resp.err_msg || "add_contact:added" == resp.err_msg;
if(success) {
callbacks.success && callbacks.success(resp);
}else{
callbacks.fail && callbacks.fail(resp);
}
})
} /**
* 调起微信Native的图片播放组件。
* 这里必须对参数进行强检测,如果参数不合法,直接会导致微信客户端crash
*
* @param {String} curSrc 当前播放的图片地址
* @param {Array} srcList 图片地址列表
*/
function imagePreview(curSrc,srcList) {
if(!curSrc || !srcList || srcList.length == 0) {
return;
}
WeixinJSBridge.invoke('imagePreview', {
'current' : curSrc,
'urls' : srcList
});
} /**
* 显示网页右上角的按钮
*/
function showOptionMenu() {
WeixinJSBridge.call('showOptionMenu');
} /**
* 隐藏网页右上角的按钮
*/
function hideOptionMenu() {
WeixinJSBridge.call('hideOptionMenu');
} /**
* 显示底部工具栏
*/
function showToolbar() {
WeixinJSBridge.call('showToolbar');
} /**
* 隐藏底部工具栏
*/
function hideToolbar() {
WeixinJSBridge.call('hideToolbar');
} /**
* 返回如下几种类型:
*
* network_type:wifi wifi网络
* network_type:edge 非wifi,包含3G/2G
* network_type:fail 网络断开连接
* network_type:wwan 2g或者3g
*
* 使用方法:
* WeixinApi.getNetworkType(function(networkType){
*
* });
*
* @param callback
*/
function getNetworkType(callback) {
if (callback && typeof callback == 'function') {
WeixinJSBridge.invoke('getNetworkType', {}, function (e) {
// 在这里拿到e.err_msg,这里面就包含了所有的网络类型
callback(e.err_msg);
});
}
} /**
* 关闭当前微信公众平台页面
* @param {Object} callbacks 回调方法
* @p-config {Function} fail(resp) 失败
* @p-config {Function} success(resp) 成功
*/
function closeWindow(callbacks) {
callbacks = callbacks || {};
WeixinJSBridge.invoke("closeWindow",{},function(resp){
switch (resp.err_msg) {
// 关闭成功
case 'close_window:ok':
callbacks.success && callbacks.success(resp);
break; // 关闭失败
default :
callbacks.fail && callbacks.fail(resp);
break;
}
});
} /**
* 当页面加载完毕后执行,使用方法:
* WeixinApi.ready(function(Api){
* // 从这里只用Api即是WeixinApi
* });
* @param readyCallback
*/
function wxJsBridgeReady(readyCallback) {
if (readyCallback && typeof readyCallback == 'function') {
var Api = this;
var wxReadyFunc = function () {
readyCallback(Api);
};
if (typeof window.WeixinJSBridge == "undefined"){
if (document.addEventListener) {
document.addEventListener('WeixinJSBridgeReady', wxReadyFunc, false);
} else if (document.attachEvent) {
document.attachEvent('WeixinJSBridgeReady', wxReadyFunc);
document.attachEvent('onWeixinJSBridgeReady', wxReadyFunc);
}
}else{
wxReadyFunc();
}
}
} /**
* 判断当前网页是否在微信内置浏览器中打开
*/
function openInWeixin(){
return /MicroMessenger/i.test(navigator.userAgent);
} /*
* 打开扫描二维码
* @param {Object} callbacks 回调方法
* @p-config {Function} fail(resp) 失败
* @p-config {Function} success(resp) 成功
*/
function scanQRCode (callbacks) {
callbacks = callbacks || {};
WeixinJSBridge.invoke("scanQRCode",{},function(resp){
switch (resp.err_msg) {
// 打开扫描器成功
case 'scan_qrcode:ok':
callbacks.success && callbacks.success(resp);
break; // 打开扫描器失败
default :
callbacks.fail && callbacks.fail(resp);
break;
}
});
} /**
* 检测应用程序是否已安装
* by mingcheng 2014-10-17
*
* @param {Object} data 应用程序的信息
* @p-config {String} packageUrl 应用注册的自定义前缀,如 xxx:// 就取 xxx
* @p-config {String} packageName 应用的包名
*
* @param {Object} callbacks 相关回调方法
* @p-config {Function} fail(resp) 失败
* @p-config {Function} success(resp) 成功,如果有对应的版本信息,则写入到 resp.version 中
* @p-config {Function} all(resp) 无论成功失败都会执行的回调
*/
function getInstallState(data, callbacks) {
callbacks = callbacks || {}; WeixinJSBridge.invoke("getInstallState", {
"packageUrl": data.packageUrl || "",
"packageName": data.packageName || ""
}, function(resp) {
var msg = resp.err_msg, match = msg.match(/state:yes_?(.*)$/);
if (match) {
resp.version = match[1] || "";
callbacks.success && callbacks.success(resp);
} else {
callbacks.fail && callbacks.fail(resp);
} callbacks.all && callbacks.all(resp);
});
} /**
* 开启Api的debug模式,比如出了个什么错误,能alert告诉你,而不是一直很苦逼的在想哪儿出问题了
* @param {Function} callback(error) 出错后的回调,默认是alert
*/
function enableDebugMode(callback){
/**
* @param {String} errorMessage 错误信息
* @param {String} scriptURI 出错的文件
* @param {Long} lineNumber 出错代码的行号
* @param {Long} columnNumber 出错代码的列号
*/
window.onerror = function(errorMessage, scriptURI, lineNumber,columnNumber) { // 有callback的情况下,将错误信息传递到options.callback中
if(typeof callback === 'function'){
callback({
message : errorMessage,
script : scriptURI,
line : lineNumber,
column : columnNumber
});
}else{
// 其他情况,都以alert方式直接提示错误信息
var msgs = [];
msgs.push("额,代码有错。。。");
msgs.push("\n错误信息:" , errorMessage);
msgs.push("\n出错文件:" , scriptURI);
msgs.push("\n出错位置:" , lineNumber + '行,' + columnNumber + '列');
alert(msgs.join(''));
}
}
} return {
version :"2.5",
enableDebugMode :enableDebugMode,
ready :wxJsBridgeReady,
shareToTimeline :weixinShareTimeline,
shareToWeibo :weixinShareWeibo,
shareToFriend :weixinSendAppMessage,
generalShare :weixinGeneralShare,
addContact :addContact,
showOptionMenu :showOptionMenu,
hideOptionMenu :hideOptionMenu,
showToolbar :showToolbar,
hideToolbar :hideToolbar,
getNetworkType :getNetworkType,
imagePreview :imagePreview,
closeWindow :closeWindow,
openInWeixin :openInWeixin,
getInstallState :getInstallState,
scanQRCode :scanQRCode
};
})();

微信内置浏览器的JS API的更多相关文章

  1. 微信 关闭手机微信内置浏览器的js

    WeixinJSBridge.call('closeWindow');

  2. 微信内置浏览器的JsAPI(WeixinJSBridge续)[转载]

    原文地址:  http://www.baidufe.com/item/f07a3be0b23b4c9606bb.html 之前有写过几篇关于微信内置浏览器(WebView)中特有的Javascript ...

  3. 微信内置浏览器的JsAPI(WeixinJSBridge续)_Alien的笔记

    微信内置浏览器的JsAPI(WeixinJSBridge续)_Alien的笔记 微信内置浏览器的JsAPI(WeixinJSBridge续)进入全屏 之前有写过几篇关于微信内置浏览器(WebView) ...

  4. 微信内置浏览器的JsAPI(WeixinJSBridge续)进入全屏

    微信内置浏览器的JsAPI(WeixinJSBridge续)进入全屏 之前有写过几篇关于微信内置浏览器(WebView)中特有的Javascript API(Javascript Interface) ...

  5. 【微网站开发】之微信内置浏览器API使用

    最近在写微网站,发现了微信内置浏览器的很多不称心的地方: 1.安卓版的微信内浏览器底部总是出现一个刷新.前进.后退的底部栏,宽度很大,导致屏幕显示尺寸被压缩 2.分享当前网站至朋友圈时,分享的图片一般 ...

  6. 解决IOS微信内置浏览器返回后不执行js脚本的问题

    在A页面写一个$(function(){}) 后随便点击一个URL跳转到B页面 利用微信内置浏览器 返回键返回到A页面后发现这段JS不执行,后来找到了解决方案 $(function () { var ...

  7. 让微信内置浏览器兼容clipboard.js 复制粘贴 ios 安卓

    <!--js copy事件--><script type="text/javascript" src="/static/js/clipboard.min ...

  8. js判断微信内置浏览器

    做了一个h5页面来下载app,但如果页面是用微信扫一扫打开的,点击下载按钮下载不了app,原因是微信内置浏览器屏蔽了下载链接.所以增加了检测,如果用户是用微信浏览器打开的,则提示用户使用浏览器打开.那 ...

  9. 用js限制网页只能在微信内置浏览器或支付宝内置浏览器中打开

    function is_weixinOrAli(){ var ua = navigator.userAgent.toLowerCase(); //判断浏览器的类型 if (ua.match(/Micr ...

随机推荐

  1. oc 单例

    单例模式: //static id _instace; // //+ (id)allocWithZone:(struct _NSZone *)zone //{ // static dispatch_o ...

  2. Beta-1阶段成员贡献分(代组长更新)

    组名:天天向上 组长:王森 小组成员:张金生.张政.林莉.胡丽娜 小组贡献分如下:王森5.2   张金生5.1  张政 5.0   林莉 4.9 胡丽娜 4.8 成员得分如下: 成员 基础分 表现分 ...

  3. JavaWeb 学习008-今日问题(非空验证尚未解决) 2016-12-2

    1. 学生模块list页面 不能正常跳转 说是找不到stuid属性,但是我在entity里面和数据库建表的属性就是stuid:Grade模块代码一样,却可以正常运行 这是什么问题? <c:for ...

  4. win2008 IIS与tomcat整合

    1.在tomcat目录下新建jk文件夹 2. Copy isapi_redirect.dll到jk,并新建一个isapi_redirect.properties配置文件,内容如下: extension ...

  5. 个人理解的javascript作用域链与闭包

    闭包引入的前提个人理解是为从外部读取局部变量,正常情况下,这是办不到的.简单的闭包举例如下: function f1(){ n=100; function f2(){ alert(n); } retu ...

  6. Spring Boot项目的打包和部署

    补充一点:搜索了下别人Spring Boot部署方案,大多都说:①packaging设为war:②要添加Spring Boot的tomcat依赖:③修改output路径,但是使用STS新建Spring ...

  7. C#数据结构选择

    选择一个合适的数据结构会对程序的性能有着显著的提高 线性表和链表: 1.LinkedList<T>:适合于元素数组不固定,存在大量列表的头尾添加动作场合.其它可使用List<T> ...

  8. python学习之路-day6-面向对象

    一.面向对象学习 特性 class类 一个类即是对一类拥有相同属性的对象的抽象.蓝图.原型.在类中定义了这些对象的都具备的属性.共同的方法. 面向过程编程和面向对象编程: 面向过程编程:使用一系列的指 ...

  9. 用Java导出为excel表格

    导出的是最基础的excel表格,没有任何样式. <input type="button" value="输出到Excel" onclick='output ...

  10. Php 笔记

    php基本简介 为何要学习php 通过上网查资料,了解了基本的php知识,并知道了php的优缺点.php是一种通用开源脚本语言.语法吸收了C语言.Java和Perl的特点,利于学习,使用广泛,主要适用 ...