官方文档
http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html
为了兼容原来的代码,重写WeixinApi的js,只处理分享的部分….
/**
* ! 微信内置浏览器的Javascript API,功能包括:
*
* 1、分享到微信朋友圈 2、分享给微信好友 3、分享到腾讯微博 4、隐藏/显示右上角的菜单入口 5、隐藏/显示底部浏览器工具栏 6、获取当前的网络状态
* 7、调起微信客户端的图片播放组件 8、关闭公众平台Web页面
*
* @author zhaoxianlie(http://www.baidufe.com)
*
* @author caihaibin 1.只重写分享部分,兼容原代码
*/
var WeixinApi = (function() {
"use strict";
/**
* 分享到微信朋友圈
*
* @param {Object}
* data 待分享的信息
* @p-config {String} appId 公众平台的appId(服务号可用)
* @p-config {String} imageUrl 图片地址
* @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(res) 取消
* @p-config {Function} fail(res) 失败
* @p-config {Function} confirm(res) 成功
* @p-config {Function} all(res) 无论成功失败都会执行的回调
*/
function weixinShareTimeline(data, callbacks) {
callbacks = callbacks || {};
var theData = data;
wx.onMenuShareTimeline({
title : theData.title,
desc : theData.desc,
link : theData.link,
imgUrl : theData.imgUrl,
trigger : function(res) {
callbacks.ready && callbacks.ready(res);
},
success : function(res) {
callbacks.confirm && callbacks.confirm(res);
},
cancel : function(res) {
callbacks.cancel && callbacks.cancel(res);
},
fail : function(res) {
callbacks.fail && callbacks.fail(res);
}
});
}
/**
* 发送给微信上的好友
*
* @param {Object}
* data 待分享的信息
* @p-config {String} appId 公众平台的appId(服务号可用)
* @p-config {String} imageUrl 图片地址
* @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(res) 取消
* @p-config {Function} fail(res) 失败
* @p-config {Function} confirm(res) 成功
* @p-config {Function} all(res) 无论成功失败都会执行的回调
*/
function weixinSendAppMessage(data, callbacks) {
callbacks = callbacks || {};
var theData = data;
wx.onMenuShareAppMessage({
title : theData.title,
desc : theData.desc,
link : theData.link,
imgUrl : theData.imgUrl,
trigger : function(res) {
callbacks.ready && callbacks.ready(res);
},
success : function(res) {
callbacks.confirm && callbacks.confirm(res);
},
cancel : function(res) {
callbacks.cancel && callbacks.cancel(res);
},
fail : function(res) {
callbacks.fail && callbacks.fail(res);
}
});
}
/**
* 分享到腾讯微博
*
* @param {Object}
* data 待分享的信息
* @p-config {String} imageUrl 图片地址
* @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(res) 取消
* @p-config {Function} fail(res) 失败
* @p-config {Function} confirm(res) 成功
* @p-config {Function} all(res) 无论成功失败都会执行的回调
*/
function weixinShareWeibo(data, callbacks) {
callbacks = callbacks || {};
var theData = data;
wx.onMenuShareWeibo({
title : theData.title,
desc : theData.desc,
link : theData.link,
imgUrl : theData.imgUrl,
trigger : function(res) {
callbacks.ready && callbacks.ready(res);
},
success : function(res) {
callbacks.confirm && callbacks.confirm(res);
},
cancel : function(res) {
callbacks.cancel && callbacks.cancel(res);
},
fail : function(res) {
callbacks.fail && callbacks.fail(res);
}
});
}
/**
* 分享到腾讯微博
*
* @param {Object}
* data 待分享的信息
* @p-config {String} imageUrl 图片地址
* @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(res) 取消
* @p-config {Function} fail(res) 失败
* @p-config {Function} confirm(res) 成功
* @p-config {Function} all(res) 无论成功失败都会执行的回调
*/
function onMenuShareQQ(data, callbacks) {
callbacks = callbacks || {};
var theData = data;
wx.onMenuShareQQ({
title : theData.title,
desc : theData.desc,
link : theData.link,
imgUrl : theData.imgUrl,
trigger : function(res) {
callbacks.ready && callbacks.ready(res);
},
success : function(res) {
callbacks.confirm && callbacks.confirm(res);
},
cancel : function(res) {
callbacks.cancel && callbacks.cancel(res);
},
fail : function(res) {
callbacks.fail && callbacks.fail(res);
}
});
}
/**
* 调起微信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);
});
}
}
/**
* 关闭当前微信公众平台页面
*/
function closeWindow() {
WeixinJSBridge.call("closeWindow");
}
/**
* 当页面加载完毕后执行,使用方法: WeixinApi.ready(function(Api){ // 从这里只用Api即是WeixinApi
* });
*
* @param readyCallback
*/
function wxJsBridgeReady(readyCallback) {
if (readyCallback && typeof readyCallback == 'function') {
var Api = this;
// 当在微信中时,才进行签名处理.
if (Api.inWeixin) {
/**
* 需要引用jquery weixinjs_url 获取当前url的签名参数
*/
$.post('http://xxxxxxxx/weixinjs/index', {
weixinjs_url : location.href
}, function(result) {
wx.config(result.obj);
}, 'json');
}
var wxReadyFunc = function() {
readyCallback(Api);
};
wx.ready(wxReadyFunc);
return;
}
}
return {
version : "1.6",
ready : wxJsBridgeReady,
shareToTimeline : weixinShareTimeline,
shareToWeibo : weixinShareWeibo,
shareToFriend : weixinSendAppMessage,
shareToQq : onMenuShareQQ,
showOptionMenu : showOptionMenu,
hideOptionMenu : hideOptionMenu,
showToolbar : showToolbar,
hideToolbar : hideToolbar,
getNetworkType : getNetworkType,
imagePreview : imagePreview,
closeWindow : closeWindow,
// 在微信内才进行签名判断.
inWeixin : navigator.userAgent.toLowerCase().match(/MicroMessenger/i) == "micromessenger"
};
})();
jssdk.php
替换
JSSDK::getSignPackage()
public function getSignPackage() {
$jsapiTicket = $this->getJsApiTicket ();
$url = "http://$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]";
// 通过外部参数进行目标的url的签名
if ($_REQUEST ['weixinjs_url']) {
$url = $_REQUEST ['weixinjs_url'];
}
$timestamp = time ();
$nonceStr = $this->createNonceStr ();
// 这里参数的顺序要按照 key 值 ASCII 码升序排序
$string = "jsapi_ticket=$jsapiTicket&noncestr=$nonceStr×tamp=$timestamp&url=$url";
$signature = sha1 ( $string );
$signPackage = array (
"appId" => $this->appId,
"nonceStr" => $nonceStr,
"timestamp" => $timestamp,
"url" => $url,
"signature" => $signature,
"rawString" => $string
);
return $signPackage;
}
服务器端签名
public function actionIndex() {
if ($_SERVER ['HTTP_ORIGIN'])
header ( "Access-Control-Allow-Origin: " . $_SERVER ['HTTP_ORIGIN'] );
header ( "Access-Control-Allow-Credentials: true" );
$title = '微信签名相关';
lib ( "weixin/js/jssdk.php" );
$jssdk = new JSSDK ( "xxxxxxxx", "xxxxxxx" );
$signPackage = $jssdk->GetSignPackage ();
$result = array (
'appId' => $signPackage ["appId"],
'timestamp' => $signPackage ["timestamp"],
'nonceStr' => $signPackage ["nonceStr"],
'signature' => $signPackage ["signature"],
'jsApiList' => array (
'onMenuShareAppMessage',
'onMenuShareTimeline',
'onMenuShareQQ',
'onMenuShareWeibo'
)
);
sjson ( true, $title, '', $result );
}
调用方式
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<!-- 重写后的 js-->
<script src="http://xxxxxx/js/WeixinApi.js"></script>
<!--
原来代码不用进行调整,方便修复.如果代码有问题,也可以对WeixinApi.js进行统一修改
-->